Keyboard shortcuts

Press or to navigate between chapters

Press S or / to search in the book

Press ? to show this help

Press Esc to hide this help

Sankey flow diagram

Show flows between nodes laid out in columns — sources on the left, sinks on the right, intermediate nodes in between. Ribbon thickness encodes flow magnitude. Useful for conversion funnels, budget allocation, energy flow, attribution.

The demo plots the NASA astronaut career flow, Groups 1–3 (Mercury / Gemini / Apollo eras). ~30 astronauts; sources on the left are the service branches they came from (USAF, Navy / USMC); the middle column groups them by training cohort (Mercury or Gemini); the right shows the ultimate Apollo outcome (Walked on Moon vs Did not). Twelve astronauts ultimately walked on the Moon — the right-hand ribbon converging into that node is the visible bottom-line of the whole program.

Source: NASA Astronaut Group 1 — Wikipedia

Public surface

use wisp_chart::topology::{Sankey, SankeyLink, SankeyNode};

let nodes = vec![
    SankeyNode::new("Organic",   /* column */ 0, blue),
    SankeyNode::new("Paid",      0, orange),
    SankeyNode::new("Signed Up", 1, green),
    SankeyNode::new("Trial",     1, pink),
    SankeyNode::new("Converted", 2, sky),
    SankeyNode::new("Lost",      2, gold),
];
let links = vec![
    SankeyLink::new(0, 2, 40.0, grey),
    SankeyLink::new(0, 3, 25.0, grey),
    // ...
];
let s = Sankey::new(nodes, links);
let g = s.emit_graphics(&theme, viewport);

Layout

v1 uses a column-based layout: every node names its column explicitly, link Y-positions stack within each column in declaration order, and ribbon ribbons are drawn as convex quads (not Bezier curves). Quads are visually noisier than Beziers at crossings but are deterministic, cheap, and easy to test — appropriate for v1.

When to reach for Sankey

  • Conversion / funnel narratives where you also want to show the lost flow at each step.
  • Budget allocation between fixed buckets.
  • "Where does this come from / where does it go" — anything with a clear flow direction.

For a strictly-stepped conversion without crossings, funnel is the simpler shape.