Skip to content

SankeyChart

Defined in: charts/sankey.ts:23

Canvas 2D Sankey diagram. Pass a {nodes, links} object directly via setSankey() (or via setData([], { nodes, links } as any) from React).

Layout is delegated to layoutSankey (column-DAG + iterative relaxation), keeping draw passes O(nodes + links).

Example

const chart = new SankeyChart('#chart');
chart.setSankey(
[{ id: 'A' }, { id: 'B' }, { id: 'C' }],
[{ source: 'A', target: 'B', value: 10 }, { source: 'A', target: 'C', value: 5 }],
);

Extends

Constructors

Constructor

new SankeyChart(container, config?): SankeyChart

Defined in: charts/sankey.ts:33

Parameters

container

string | HTMLElement

config?

SankeyChartConfig = {}

Returns

SankeyChart

Overrides

BaseChart.constructor

Properties

animator

animator: Animator

Defined in: core/base.ts:34

Inherited from

BaseChart.animator


animProgress

animProgress: number = 1

Defined in: core/base.ts:37

Inherited from

BaseChart.animProgress


canvas

canvas: HTMLCanvasElement

Defined in: core/base.ts:31

Inherited from

BaseChart.canvas


config

config: SankeyChartConfig & Required<Pick<BaseChartConfig, "title" | "animate" | "animDuration" | "animEasing" | "responsive" | "showGrid" | "showTooltip" | "showLegend" | "legendPosition" | "subtitle">> & BaseChartConfig

Defined in: charts/sankey.ts:24

Overrides

BaseChart.config


container

container: HTMLElement

Defined in: core/base.ts:22

Inherited from

BaseChart.container


ctx

ctx: CanvasRenderingContext2D

Defined in: core/base.ts:32

Inherited from

BaseChart.ctx


height

height: number = 0

Defined in: core/base.ts:40

Inherited from

BaseChart.height


hoverIndex

hoverIndex: number = -1

Defined in: core/base.ts:36

Inherited from

BaseChart.hoverIndex


padding

padding: Padding

Defined in: core/base.ts:41

Inherited from

BaseChart.padding


resolved

resolved: ResolvedData

Defined in: core/base.ts:38

Inherited from

BaseChart.resolved


theme

theme: Theme

Defined in: core/base.ts:33

Inherited from

BaseChart.theme


tooltip

tooltip: Tooltip | null

Defined in: core/base.ts:35

Inherited from

BaseChart.tooltip


width

width: number = 0

Defined in: core/base.ts:39

Inherited from

BaseChart.width

Accessors

plotArea

Get Signature

get plotArea(): PlotArea

Defined in: core/base.ts:154

Returns

PlotArea

Inherited from

BaseChart.plotArea

Methods

_draw()

_draw(): void

Defined in: charts/sankey.ts:118

Returns

void

Overrides

BaseChart._draw


_onMouse()

_onMouse(e): void

Defined in: charts/sankey.ts:91

Parameters

e

MouseEvent

Returns

void

Overrides

BaseChart._onMouse


destroy()

destroy(): void

Defined in: core/base.ts:222

Returns

void

Inherited from

BaseChart.destroy


resize()

resize(): void

Defined in: core/base.ts:212

Returns

void

Inherited from

BaseChart.resize


setData()

setData(_data, mapping?): void

Defined in: charts/sankey.ts:51

React passes the graph through mapping; we forward to setSankey.

Parameters

_data

any

mapping?

any

Returns

void

Overrides

BaseChart.setData


setSankey()

setSankey(nodes, links): void

Defined in: charts/sankey.ts:42

Set the Sankey graph and trigger an entry animation.

Parameters

nodes

SankeyNode[]

SankeyLink[]

Returns

void


setTheme()

setTheme(name): void

Defined in: core/base.ts:181

Parameters

name

string

Returns

void

Inherited from

BaseChart.setTheme


toDataURL()

toDataURL(type?, quality?): string

Defined in: core/base.ts:218

Export the current chart as a PNG data URL.

Parameters

type?

string = 'image/png'

quality?

number = 0.92

Returns

string

Inherited from

BaseChart.toDataURL


update()

update(arg, mapping?): void

Defined in: charts/sankey.ts:63

update({ nodeWidth: ... }) etc. — invalidate so the next draw re-lays out.

Parameters

arg

any

mapping?

any

Returns

void

Overrides

BaseChart.update