Big welcome by the Chartist Guy

Chartist is a simple responsive charting library built with SVG. There are hundreds of nice charting libraries already out there, but they are either:

• use the wrong technologies for illustration (canvas)
• weighs hundreds of kilobytes
• are not flexible enough while keeping the configuration simple
• are not friendly to designers
• more annoying things

That's why we started Chartist and our goal is to solve all of the above issues.

Quickstart

Install this library using your favorite package manager:

pnpm

pnpm add chartist

yarn

yarn add chartist

npm

npm install --save chartist

Then, just import chart you want and use it:

import { BarChart } from 'chartist';

new BarChart('#chart', {
  labels: ['W1', 'W2', 'W3', 'W4', 'W5', 'W6', 'W7', 'W8', 'W9', 'W10'],
  series: [
    [1, 2, 4, 8, 6, -2, -1, -4, -6, -2]
  ]
}, {
  high: 10,
  low: -10,
  axisX: {
    labelInterpolationFnc: (value, index) => (index % 2 === 0 ? value : null)
  }
});

Need an API to fetch data?

Please consider Cube, an open-source API for data apps.

Examples

Please see live examples.

Getting Help

Need help? Ask your question on Gitter, GitHub Discussions or Stack Overflow.

If you've encountered an issue, please file it on GitHub.