Stacked Bar Chart: What It Is and When to Use One

A stacked bar chart splits each bar into parts. Instead of one solid block, every bar is a pile of colored segments, and together the segments make the total. You will see it in reports and dashboards everywhere, and it is easy to misread. This guide explains what it is, when it works, when it misleads, and how to read and build one.

What a Stacked Bar Chart Is

A bar chart shows categorical data with rectangular bars whose lengths are proportional to the values they represent. A stacked bar chart, also known as a composite bar chart, stacks bars on top of each other so that the height of the resulting stack shows the combined result. That is the definition in Wikipedia’s article on the bar chart.

Here is a simple case. A shop sells the same product online and in its store, and we have the units sold in each quarter. Each bar is one quarter. The bottom segment is online sales, the top segment is store sales, and the top of the bar is the total.

Notice the two questions this chart answers. First, how big was each quarter overall? The whole bar tells you. Second, what was each quarter made of? The colors tell you.

Open this stacked bar chart in the bar graph maker

Stacked Bar Chart vs Grouped Bar Chart

There is a second way to draw the same numbers. In a grouped bar chart, also called a clustered bar chart, each category gets one bar per series, and the bars stand side by side. The numbers are identical. Only the picture changes.

Compare the two charts. In the stacked version you see the total at once. In the grouped version you compare online with store directly, because both bars start at zero. Claus Wilke makes the same point in his open textbook Fundamentals of Data Visualization: stacked bars can work for comparing several conditions or a time series, while side-by-side bars are better when you want to compare the individual parts directly.

So the choice is a question of purpose:

• Do you care about the total? Stack.
• Do you care about comparing the parts? Group.

When a Stacked Bar Chart Works

The Parts Add Up to a Meaningful Total

Wilke’s rule is simple: stacking is useful when the sum of the amounts is itself a meaningful amount. His example is counts of women and men. Stack them and the bar height is the total number of people. His counter-example is median income: the sum of two medians is not a meaningful number, so stacking them would make no sense.

Ask yourself one question before you stack anything: if I add these segments together, is the result a real quantity? Units sold, books borrowed, hours worked and votes cast pass the test. Averages, rates and prices do not.

There Are Few Segments

Every extra segment adds one more color for the reader to match to the legend. Wilke notes that position is easy to read while color takes more mental effort. Keep the pile to two, three or four segments, and if you have more, group the small ones into “Other”.

There Are Only Two Segments, or a Clear Order

Wilke also points out that the shifting-baseline problem goes away when there are only two segments in each stack, and the chart can then be quite clear. With two segments, the bottom one sits on the axis and the top one can be read from the total minus the bottom. The quarterly chart above is that case.

You Are Showing Proportions Over Time

Stacked bars are also a good fit for a sequence of proportions. Wilke draws a stacked bar for each year to show how the share of women in the Rwandan parliament changed over time, and adds a dashed line at 50 percent so the reader can see the year the majority changed. Without that line, he writes, it would be near impossible to tell who held the majority in some years. If you show proportions, add a reference point that answers the reader’s real question.

When a Stacked Bar Chart Misleads

The trouble starts when you have three or more segments and you want the reader to compare the upper ones.

Only the bottom segment starts at the axis. Every other segment starts where the one below it ends. So its start moves up and down from bar to bar, and the eye has nothing to line up against. Wilke states the problem in one sentence: stacked bars have the problem that the different bars cannot be compared easily because they have different baselines. In one of his examples, the relative shares within each year are hard to compare, and comparing the middle parts across years is difficult because the bars are shifted relative to each other.

See it for yourself. Here are three products stacked.

Notebooks, the bottom segment, are easy to read: they barely change. Now try the middle segment. The pen segment in March and in April starts at slightly different heights, so you cannot compare the two by lining them up. You have to judge each length on its own.

Here is the same data as a grouped chart.

Now the pens comparison is trivial. The price you pay is that the monthly totals are gone.

Here is a rule you can apply right away. Put the series the reader must compare most at the bottom. If two series matter equally and you have more than two, use grouped bars.

How to Read a Stacked Bar Chart

Follow these five steps and you will avoid most misreadings.

1. Read the title and the axis. What is being counted, and in what unit?
2. Read the legend. Match each color to its series, then check which color touches the axis. Programs differ: in our bar graph maker the first series in the legend is the bottom segment, but some tools list the legend in the reverse order.
3. Read the total first. The height of the whole bar answers the question “how much overall?”
4. Read the bottom segment by its height. It starts at zero, so its height is its value.
5. Read every other segment by its length, not by where it ends. Measure how tall the segment is. If values are printed inside the segments, use them.

Wilke recommends that when a plot displays only a small number of different values, it makes sense to add the actual numbers to the plot. That is why the quarterly chart at the top of this page prints its values.

How to Build a Stacked Bar Chart

You can build one in the bar graph maker in a minute. There is nothing to install and no account.

1. Open the tool and enter your categories. Each row is one bar, such as a quarter, a class or a month.
2. Add one series per segment. Press Add series and name it. Each series becomes one color of segment.
3. Or paste a table. Copy a block from a spreadsheet, with labels in the first column and a header row, and paste it in. The tool detects the header and values such as $1,200.
4. Switch the layout to Stacked. Under “With several series”, choose Stacked.
5. Turn on Show values on the chart. Segment values appear inside the bars, and the total appears above each stack.
6. Export. Download a PNG for slides and documents, or an SVG you can scale and edit.

The order of the columns is the order of the pile. The first series sits on the axis, so put the most important one first.

Start from this example in the bar graph maker

Negative Values in a Stacked Bar Chart

What if some numbers are negative, such as costs? In our bar graph maker, positive values stack upward from zero and negative values stack downward from zero, separately. So a bar can have a pile above the axis and a pile below it.

This works when the two directions mean different things, such as income and costs. Be careful with the labels: the number printed above a bar is the total of the positive segments, not the net result. If the net matters, show it in a separate line chart or in the text.

100 Percent Stacked Bar Charts

In a 100 percent stacked bar chart, every bar is scaled to the same height, so the segments show shares instead of amounts. It is the right picture when you want to compare proportions across groups and the totals are not the point.

Our bar graph maker does not have a separate 100 percent mode. You can still draw one: enter percentages that add up to 100 in each row and use stacked mode. The chart below does exactly that.

Because every bar has the same total, the only thing left to compare is the mix. The bottom segment is still the easiest to compare across bars, so put the group you care about at the bottom. In this sample the car share stays at 25 percent, while walking grows and the bus share falls.

Vertical and Horizontal Stacked Bars

Stacked bars can stand upright or lie on their side. Use vertical bars for time, because time reads from left to right. Use horizontal bars when your category labels are long, such as survey questions, because the labels sit on the left in full instead of being tilted.

Colors and Labels

• Use a small set of distinct colors. Two or three is ideal.
• Keep the order of colors the same in every chart of a report. If Online is blue in one chart, it should be blue in all of them.
• Match the legend order to the stack order. The reader should not have to search.
• Label the segments that matter. Numbers inside the bars remove the need to match colors to a legend.
• Do not rely on color alone. Labels and values keep the chart readable in print and for readers who cannot tell certain colors apart.
• Start the axis at zero. As with any bar chart, a non-zero baseline can make similar values look deceptively different.

Alternatives to a Stacked Bar Chart

If a stacked bar is not the right fit, these are the usual alternatives.

• Grouped bars when the parts need to be compared with each other. Build them in the same tool by switching to “Side by side”.
• A pie chart when you have a single whole and just a few parts. Stephen Few argued in 2007 that people compare the areas and angles of pie slices less accurately than lengths, so keep a pie to simple shares and use bars when the reader must compare. The pie chart maker draws pies and donuts.
• A line graph when the point is a trend over time in each series. Each series gets its own line, so every one can be followed on its own. Try the line graph maker.
• One small chart per part. Wilke suggests making a separate plot for each part and showing that part relative to the whole. It takes more space, and the comparison is much easier.

Which Chart to Pick, in One Table

For a wider view of the options, and when to use each one, read our guide to the types of graphs.

Try It With Your Own Numbers

Open the example below, replace the quarters and the numbers with your own, and switch between Stacked and Side by side to see which picture answers your question better. Your data stays in your browser.