Chartist

About Chartist

Chartist.js is a JavaScript charting library for creating responsive charts using SVG. It separates styling from behavior, with chart appearance controlled through CSS (including Sass) and chart logic controlled through JavaScript. The library is approximately 10KB gzipped and has no dependencies.

It supports responsive configuration through media queries, allowing chart options such as point visibility, line display, and label formatting to change based on screen size. It also provides an animation API supporting CSS animations and SVG SMIL animations, though browser support for these features varies (tested against IE9-11, Firefox 31, Chrome 35, Safari 7-8, Android 4.3-4.4, and iOS Safari 6-7).

The library is suited for front-end developers building charts and dashboards, and has an ecosystem of wrapper libraries and integrations including a Node package for server-side charts, an Angular directive, a React component, a Meteor package, a WordPress/TablePress extension, an Ember addon, and a JavaServer Faces component.

Key features

• SVG-based responsive charts, only 10KB gzipped with no dependencies
• Styling controlled via CSS, behavior controlled via JS (separation of concerns)
• Responsive configuration overrides based on media queries
• Fully built and customizable with Sass
• Advanced CSS animations and SVG animations with SMIL
• Multi-line labels via foreignObject support

Frequently asked questions