Sankey diagram

Flow diagram with nodes and curved weighted links. Self-contained SVG (no ChartRoot).

Primitive: ChartSankey· Standalone (no ChartRoot needed)

Interactive demo

Usage

import { ChartSankey } from '@ramtt/charts'

<ChartSankey
  data={{
    nodes: [{ id: 'intake', label: 'kJ Intake' }, { id: 'z2', label: 'Z2' }],
    links: [{ source: 'intake', target: 'z2', value: 800 }],
  }}
  colors={['var(--chart-1)', 'var(--chart-2)']}
/>

Props

Prop	Type	Default	Description
data*	`{ nodes: SankeyNodeInput[]; links: SankeyLinkInput[] }`	—	Nodes + weighted links
width	`number`	600	SVG width in px
height	`number`	400	SVG height in px
nodeWidth	`number`	18	Node bar width in px
nodePadding	`number`	10	Vertical padding between nodes
colors	`string[]`	—	Color palette for nodes/links