Choose a chart by the question it needs to answer. Comparing items? Use bars. Change over time? Use a line. Parts of a whole? Use a stacked bar or, for two or three parts, a pie. Relationship between two numbers? Use a scatter plot. Flows between stages? Use a Sankey. The rest of this guide covers the cases in between.
Every chart below is in the JFDI chart maker. Paste your data once and the gallery redraws all 130 chart types with it, putting the ones that fit your data’s shape first.
1. Comparing items
Chart
Use it when
Avoid when
Bar chart
Comparing a handful to a few dozen categories, especially with long names
Showing change over time
Column chart
Comparing a few categories, or a few time periods
Category names are long
Grouped bar or column
Comparing two or three series per category
More than about four series
Dot plot
Many categories with values close together
You need to show zero as a baseline
Lollipop chart
Like a bar chart, but lighter when bars are many
Values are negative and positive
Bullet chart
Actual against a target, with good/bad bands
The audience hasn’t seen one before
Slope chart
Who rose and who fell between two points in time
More than two points in time
Diverging bar chart
Values above and below zero, or a midpoint
Everything is on one side
Sort bars by value unless the categories have a natural order (age groups, months).
2. Change over time
Chart
Use it when
Avoid when
Line chart
Continuous change, many time points
You have only two or three points
Column chart
A few periods, or totals per period
Dozens of periods
Step chart
Values that change in jumps, such as prices or interest rates
Change is gradual
Area chart
Emphasising volume over time for one series
Comparing several series that overlap
Stacked area chart
A total and its components over time
Readers need to compare the middle layers
Line with final dot
Highlighting the latest value
—
Year-over-year line
Comparing the same months across years
Data isn’t seasonal
Fan chart
A forecast with widening uncertainty
You don’t have a range
Bump chart
Rankings rising and falling
The actual values matter more than ranks
Calendar heatmap
Daily values across a year, showing weekly patterns
Data is monthly
3. Parts of a whole
Chart
Use it when
Avoid when
Stacked bar or column
Parts of a total, compared across categories
More than about five parts
100% stacked bar
Shares, not totals, across categories
Totals matter
Pie or donut
Two or three parts of one whole
Parts are similar in size, or there are many
Waffle chart
Showing a percentage people can count, such as 37 in 100
Values need decimals
Treemap
Many parts, or parts within parts
Precise comparison matters
Sunburst
Hierarchies with two or three levels
More than three levels
Waterfall chart
How a start value becomes an end value
Values aren’t sequential changes
Pie or bar? Bars win for anything but two or three slices, because people compare lengths far more accurately than angles.
4. Distributions
Chart
Use it when
Avoid when
Histogram
The shape of one set of values
Comparing many groups
Box plot
Comparing medians and spread across groups
Audience isn’t used to them
Violin plot
Comparing the shape of distributions
Groups are small
Beeswarm plot
Showing every individual value, up to a few hundred
Thousands of points
Population pyramid
Two groups (such as men and women) by age band
Groups aren’t comparable
5. Relationships
Chart
Use it when
Avoid when
Scatter plot
Two numbers per item: is there a pattern?
Only a handful of items
Scatter with trend line
Showing the direction of a relationship
The relationship isn’t straight
Bubble chart
A third number shown by size
Bubbles overlap heavily
Connected scatter plot
How two numbers moved together over time
More than one or two series
Heatmap
Values across two categories, such as day × hour
Precise values matter
Quadrant chart
Sorting items into four groups, such as impact × effort
A Sankey diagram shows how a quantity moves between stages, such as energy from fuels to uses, money from income to spending, or visitors from pages to sign-ups. Each flow is drawn as a band whose width is proportional to its size. To make one, you need a table with three columns, From, To and Value, with one row per flow.
The diagram is named after Captain Matthew Henry Phineas Riall Sankey, an Irish engineer, who used one in 1898 to show how much of a steam engine’s energy was lost at each stage (Wikipedia). Charles Minard had drawn flows of the same kind decades earlier, most famously in his 1869 map of Napoleon’s march on Moscow.
The data layout
Each row is one flow between two nodes. This is the example in the JFDI chart maker, showing energy flowing through an economy (illustrative figures, in terawatt hours):
From
To
Value
Gas
Electricity
95
Gas
Heating
120
Wind
Electricity
82
Oil
Transport
210
Electricity
Homes
105
Electricity
Losses
50
A node can be a target in one row and a source in another. Electricity receives flows from gas, wind and other fuels, then sends flows on to homes, industry and losses. The chart works out the stages from that.
The chart maker’s example Sankey: band widths are proportional to each flow.
Step by step
Open the chart maker and type sankey in the search box, then click Sankey diagram.
Replace the example data on the Data step. Paste your three columns straight from Excel or Google Sheets, with a header row.
Check the totals. Wherever a node has flows both in and out, the two sides should add up, or the difference should go to a node such as Other or Losses.
Style it on the Format step: title, colours, and node width and spacing.
Export it as PNG, SVG or PDF, or copy the embed code for a website. The interactive embed shows each flow’s value on hover.
Nothing you paste is uploaded. The chart is drawn by your browser.
Tips for a readable Sankey
Keep it to about 15 to 20 nodes. Beyond that, bands get too thin to read. Group small items into Other.
Make it balance. A node that receives 300 and sends on 250 looks wrong. Show the missing 50 explicitly, often as Losses or Unallocated.
Use the same units throughout. Mixing percentages and totals breaks the widths.
Put the story in the title. “Half of all gas goes to heating” beats “Energy flows”.
When to use something else
If you want to show
Try
How one total breaks down, one level
Bar chart or treemap
Gains and losses from a start value to an end value
How people move between categories over several stages (for example, survey answers in two years)
Alluvial chart
Steps in a sign-up or sales funnel, with drop-offs
Funnel Sankey
Revenue flowing to costs and profit
Income statement chart
All of these are in the chart maker’s Flow and process family.
Common questions
Can a flow go backwards?
Not in a standard Sankey: flows run left to right through stages. Loops (A to B to A) confuse the layout, so split repeated stages into separate nodes, such as Year 1 and Year 2.
Can I use negative values?
No. A band can’t have negative width. Show reductions as flows to a node such as Losses or Refunds.
Is it free to use commercially?
Yes. Charts you make are yours, with no watermark and no credit required.
A choropleth map shades each area, such as a country, state or council, according to a value, with darker colours usually meaning more. It’s the most common kind of data map. It works well for rates (per person, per km², percentages) and badly for totals, because big areas look important just for being big.
The word comes from the Greek choros (area) and plethos (multitude). The geographer John Kirtland Wright coined it in 1938, but the idea is much older: Baron Pierre Charles Dupin drew a map of France in 1826 shading each département by access to basic education, usually counted as the first choropleth (Wikipedia).
Mistake 1: mapping totals
Shade a world map by total population and China and India are darkest, which is true but tells you nothing a list wouldn’t. Shade it by people per km² and you see where people are actually crowded: Bangladesh, the Netherlands, Singapore, Rwanda.
Left: total population, which mostly shows which countries are big. Right: people per km², which shows where people are crowded.
Totals are what statisticians call extensive variables: they grow with the size of the area. Rates are intensive: they don’t. A choropleth should almost always show a rate. Skipping this step is one of the most common mistakes in data maps; it made some COVID-19 dashboards misleading.
If what you really want to show is a total, use sized dots instead: one circle per area, its size set by the value. Readers judge a total by the size of a circle much better than by a shade of colour.
The JFDI map maker checks for this. If a column looks like a total (it rises and falls with population, or it’s called something like Total, Number or Deaths), it suggests showing it per million people, per km², or as sized dots. You can still keep it as it is.
Mistake 2: big areas shout
Even with a rate, every area is filled with one flat colour, so a large area looks like it carries more weight than a small one with the same value. Russia, Canada and the US Mountain West dominate maps because they’re big. Ten cities with high values can be invisible next to one empty county with a slightly lower one.
Ways to soften this:
Equal-area projections. The Mercator projection used by web maps makes Greenland look as big as Africa, when Africa is about 14 times larger. Use an equal-area projection, such as Equal Earth, for any shaded map. The map maker warns you if you pick Mercator for one.
Tile or hexagon maps, where every area gets the same space. These suit US states and UK constituencies. See why election maps use hexagons.
A cartogram, where each area is sized by population.
Small areas drawn as dots so places like Singapore or Malta don’t disappear.
Choosing the colour steps
How you split values into colours changes the story. The same data can look calm or alarming depending on where the breaks fall.
Method
Use it when
Equal numbers of places per colour (quantiles)
Most data. Uses the full colour range.
Natural breaks
Values fall into clear clusters.
Equal-sized steps
Values are spread evenly, or round numbers matter.
Your own thresholds
A number means something, such as 50% or a target.
Smooth gradient
You want every difference visible. Add a log scale for data spanning several orders of magnitude.
Use one light-to-dark colour ramp for values that run from low to high. Use a two-sided (diverging) ramp only when there’s a meaningful middle, such as zero change or the national average.
A quick checklist
Before you publish a shaded map, check that:
It shows a rate, not a total (or uses sized dots for totals).
It uses an equal-area projection.
The colour steps are explained in the legend, and the breaks aren’t hiding the story.
Areas with no data are a neutral grey, not the lightest colour.
The title says what’s being measured and the source line says where it came from.
A waterfall chart shows how you get from a starting value to an ending value through a series of gains and losses. Each step is a floating bar, green for increases and red for decreases, and the final bar shows the total. To make one, you need two columns: the step name and the change.
Finance teams call it a bridge chart, because it bridges two numbers: last year’s profit and this year’s, an opening and closing cash balance, a budget and the actual spend.
The data layout
This is the example in the JFDI chart maker, a quarter’s cash movements in £ thousands:
Item
Change (£k)
Opening balance
120
Product sales
84
Services
36
Salaries
-62
Rent
-21
Marketing
-15
Tax
-12
Closing balance
Three rules:
The first row is the starting value.
Every other row is a change, positive or negative. Don’t type running totals.
Leave the value empty where you want a total. Any row with no value is drawn as a total bar showing the running total at that point. That’s how you get the final bar, and subtotals part-way through.
In this example the closing balance works out at £130k: up £10k on the quarter.
The chart maker’s example: £10k more cash at the end of the quarter than at the start.
Step by step
Open the chart maker, search for waterfall and click Waterfall chart.
Paste your two columns onto the Data step, replacing the example.
Add a total row at the end with no value.
Write a title that says the result, such as “Cash went up £10k this quarter”. The chart maker’s example does exactly this.
Set the units under Format › Numbers (a £ prefix and k suffix, for example) and turn on value labels.
Export as PNG for slides, SVG or PDF for print, or an embed for a web page.
Showing subtotals
To show a subtotal part-way through, such as gross profit before overheads, add a row with an empty value and a name like Gross profit where it should appear. The bar is drawn from zero to the running total at that point, and the steps after it continue from there.
Getting the order right
The order of the rows is the order of the story. Common conventions:
Income first, then costs, so the chart climbs and then falls.
Biggest changes first within each group, so the reader sees what mattered most.
Group small items into Other to keep it to about 10 steps.
When to use something else
To show where money goes rather than how a total changed, a Sankey diagram or the chart maker’s Income statement chart (revenue flowing to costs and profit) is clearer.
To compare several totals side by side, use a column chart.
To show change over time for one value, use a line chart.
Making one in Excel instead
Excel has had a built-in waterfall chart since Excel 2016, under Insert › Charts. Its quirk is that totals aren’t automatic: you right-click a bar and choose Set as total. The chart maker does it from the empty cells, works in any browser, and exports SVG and embeds, which Excel doesn’t.
