Sankey diagram

Vanilla JS

import { SankeyChart } from '@arshad-shah/swift-chart';

const chart = new SankeyChart('#chart', { theme: 'midnight' });
chart.setSankey(energyFlow.nodes, energyFlow.links);

React

import { Sankey } from '@arshad-shah/swift-chart/react';

<Sankey nodes={nodes} links={links} theme="midnight" height={360} />

Layout

The layout splits nodes into columns by longest source-path and relaxes y positions iteratively. Tune density with nodePadding and nodeWidth.

Reference

• Class: SankeyChart
• React component: Sankey
• Layout helper: layoutSankey