Package Exports

chartjs-chart-sankey

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (chartjs-chart-sankey) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

chartjs-chart-sankey

Chart.js v3.0.0-beta.10 module for creating sankey diagrams

npm bundle size GitHub

Browser support

All modern and up-to-date browsers are supported, including, but not limited to:

Chrome
Edge
Firefox
Safari

Internet Explorer 11 is not supported.

Documentation

To create a sankey chart, include chartjs-chart-sankey.js after chart.js and then create the chart by setting the type attribute to 'sankey'

new Chart(ctx, {
    type: 'sankey',
    data: dataObject
});

Configuration

Example:

new Chart(ctx, {
    type: 'sankey',
    data: {
        datasets: [{
            label: 'My sankey',
            data: [
                { from: 'a', to: 'b', flow: 10 },
                { from: 'a', to: 'c', flow: 5},
                { from: 'b', to: 'c', flow: 10 }
            ],
            colorFrom: (c) => getColor(c.dataset.data[c.dataIndex].from),
            colorTo: (c) => getColor(c.dataset.data[c.dataIndex].to),
        }]
    },
});

Example

Sankey Example Image

Online examples

codepen Vue.js 2

Development

You first need to install node dependencies (requires Node.js):

> npm install

The following commands will then be available from the repository root:

> npm run build         // build dist files
> npm run autobuild     // build and watch for changes
> npm test              // run all tests
> npm autotest          // run all tests and watch for changes
> npm lint              // perform code linting
> npm package           // create an archive with dist files and samples

License

chartjs-chart-sankey is available under the MIT license.