Sankey Chart

A flow diagram of values moving between source and target nodes.

Power distribution

Usage

import {
  SankeyChart,
  type SankeyChartNode,
  type SankeyChartLink,
} from '@epilot/spark-ui/sankey-chart'
<SankeyChart nodes={nodes} links={links} />

API Reference

SankeyChartProps

PropTypeDefault
nodesSankeyChartNode[]
linksSankeyChartLink[]
categoryColorsRecord<string, string>
defaultColorstring (CSS color)gray
valueSuffixstring
valueFormatIntl.NumberFormatOptions
heightnumber260
nodeWidthnumber12
nodePaddingnumber10
labelPaddingnumber96
titlestring

SankeyChartNode

FieldType
idstring
labelstring
categorystring
colorstring
FieldType
sourcestring
targetstring
valuenumber
colorstring

On this page