Examples · Sankey

Sankey diagram examples

A household earns money from two sources, puts it into one budget, then pays for rent, food and other costs. This fictional monthly budget follows those amounts across four stages. Wider ribbons carry larger amounts.

When to use it

  • Follow a resource across several stages
  • See which destinations account for the largest outgoing flows

Not the right shape?

Use a bar chart to compare amounts, a treemap for parts of one total, or a line chart for changes over time. A Sankey needs directed links. Circular routes must be separated into distinct stages before importing.

Real-world examples

Visits before a purchase

Illustrative sessions. The Exit destinations make drop-offs explicit.

Open in maker with this data

View the spec 
{
  "type": "sankey",
  "theme": "editorial",
  "title": "Where visitors leave the path",
  "source": "Illustrative data · sessions",
  "data": {
    "labels": [],
    "series": [],
    "links": [
      {
        "source": "Search",
        "target": "Product page",
        "value": 800
      },
      {
        "source": "Email",
        "target": "Product page",
        "value": 300
      },
      {
        "source": "Direct",
        "target": "Guide",
        "value": 500
      },
      {
        "source": "Guide",
        "target": "Product page",
        "value": 200
      },
      {
        "source": "Guide",
        "target": "Exit after guide",
        "value": 300
      },
      {
        "source": "Product page",
        "target": "Checkout",
        "value": 500
      },
      {
        "source": "Product page",
        "target": "Exit after product",
        "value": 800
      },
      {
        "source": "Checkout",
        "target": "Purchase",
        "value": 350
      },
      {
        "source": "Checkout",
        "target": "Exit at checkout",
        "value": 150
      }
    ]
  }
}

Energy from source to sector

Illustrative energy supplied to each sector. These links contain two stages.

Open in maker with this data

View the spec 
{
  "type": "sankey",
  "theme": "editorial",
  "title": "Energy sources and their destinations",
  "source": "Illustrative data · energy units",
  "data": {
    "labels": [],
    "series": [],
    "links": [
      {
        "source": "Electricity",
        "target": "Homes",
        "value": 50
      },
      {
        "source": "Electricity",
        "target": "Industry",
        "value": 70
      },
      {
        "source": "Gas",
        "target": "Homes",
        "value": 40
      },
      {
        "source": "Gas",
        "target": "Industry",
        "value": 90
      },
      {
        "source": "Oil",
        "target": "Transport",
        "value": 130
      }
    ]
  }
}
Open this chart in a maker Sankey diagram maker from scratch

Questions people ask

What does the width of a ribbon mean?

Ribbon width represents its value. A flow of 120 is twice as thick as one of 60. Hover over a ribbon to read its value and share of the source node’s outflow.

What if a node receives more than it sends?

The node uses the larger total. Unused space remains visible, and its tooltip reports the difference. Add a named destination such as Losses if that difference represents a measured flow.

Can the diagram have more than two stages?

Yes. Links can span up to eight stages, with 50 nodes and 100 links. A link cannot return to an earlier node and create a cycle. Repeated links between the same two nodes are added together.