{"id":1011,"date":"2026-10-23T17:32:28","date_gmt":"2026-10-23T17:32:28","guid":{"rendered":"http:\/\/jfdi-blog-how-to-make-a-sankey-diagram"},"modified":"2026-10-23T17:32:28","modified_gmt":"2026-10-23T17:32:28","slug":"how-to-make-a-sankey-diagram","status":"publish","type":"post","link":"https:\/\/jfdi.pro\/blog\/how-to-make-a-sankey-diagram\/","title":{"rendered":"How to make a Sankey diagram, free and without an account"},"content":{"rendered":"\n

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<\/strong>, To<\/strong> and Value<\/strong>, with one row per flow.<\/p>\n\n\n\n

\n
Make a Sankey diagram<\/a><\/div>\n<\/div>\n\n\n\n

Where the name comes from<\/h2>\n\n\n\n

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<\/a>). Charles Minard had drawn flows of the same kind decades earlier, most famously in his 1869 map of Napoleon’s march on Moscow.<\/p>\n\n\n\n

The data layout<\/h2>\n\n\n\n

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):<\/p>\n\n\n\n

From<\/th>To<\/th>Value<\/th><\/tr><\/thead>
Gas<\/td>Electricity<\/td>95<\/td><\/tr>
Gas<\/td>Heating<\/td>120<\/td><\/tr>
Wind<\/td>Electricity<\/td>82<\/td><\/tr>
Oil<\/td>Transport<\/td>210<\/td><\/tr>
Electricity<\/td>Homes<\/td>105<\/td><\/tr>
Electricity<\/td>Losses<\/td>50<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n

A node can be a target in one row and a source in another. Electricity<\/em> 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.<\/p>\n\n\n\n

\"A
The chart maker’s example Sankey: band widths are proportional to each flow.<\/figcaption><\/figure>\n\n\n\n

Step by step<\/h2>\n\n\n\n
    \n
  1. Open the chart maker<\/a><\/strong> and type sankey<\/em> in the search box, then click Sankey diagram<\/strong>.<\/li>\n\n\n\n
  2. Replace the example data<\/strong> on the Data step. Paste your three columns straight from Excel or Google Sheets, with a header row.<\/li>\n\n\n\n
  3. Check the totals.<\/strong> 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<\/em> or Losses<\/em>.<\/li>\n\n\n\n
  4. Style it<\/strong> on the Format step: title, colours, and node width and spacing.<\/li>\n\n\n\n
  5. Export it<\/strong> as PNG, SVG or PDF, or copy the embed code for a website. The interactive embed shows each flow’s value on hover.<\/li>\n<\/ol>\n\n\n\n

    Nothing you paste is uploaded. The chart is drawn by your browser.<\/p>\n\n\n\n

    Tips for a readable Sankey<\/h2>\n\n\n\n