Component
SankeyChart
Flows between named nodes, sized by volume.
import { SankeyChart } from '@loidolt/theme-charts';
Example
Flow diagram of 6 flows between 7 nodes. Largest: Sheets in to Cut parts (72), Cut parts to Shipped (66) and Sheets in to Offcuts (28).
| From | To | Value |
|---|---|---|
| Sheets in | Cut parts | 72 |
| Sheets in | Offcuts | 28 |
| Cut parts | Shipped | 66 |
| Cut parts | Reworked | 6 |
| Offcuts | Reused | 19 |
| Offcuts | Scrap | 9 |
Notes
- Links to unknown nodes, loops and zero-sized flows throw before ECharts sees them.
Props
Generated from the component source, so it cannot drift from the implementation.
| Prop | Type | Default | Notes |
|---|---|---|---|
data required | SankeyData | — | Named nodes and the flows between them. |
tableLabels | { sourceLabel?: string; targetLabel?: string; valueLabel?: string } | {} | Headings of the data table columns. |
Plus the attributes of Omit<ComponentProps<typeof Chart>, 'option' | 'table' | 'extensions'>andSankeyOptions, forwarded to the root element.