An example of a simple line chart with three series.

Chartist does not freak out if you have holes in your data. Instead it will render the lines in segments and handles these holes gracefully. This also allows you to introduce a line at a later point or to terminate the series before others.

You're dealing with series that contain only whole numbers? It looks weird that Chartist is creating a scale that contains fractions even if your data does not? No problem! Tell the Chartist guy to only use integers and he'll do the math!

This advanced example uses a line chart to draw a scatter diagram. The data object is created with a functional style random mechanism. There is a mobile first responsive configuration using the responsive options to show less labels on small screens.

This chart uses the showArea option to draw line, dots but also an area shape. Use the low option to specify a fixed lower bound that will make the area expand. You can also use the areaBase property to specify a data value that will be used to determine the area shape base position (this is 0 by default).

You can also only draw the area shapes of the line chart. Area shapes will always be constructed around their areaBase (that can be configured in the options) which also allows you to draw nice bi-polar areas.

By naming your series using the series object notation with a name property, you can enable the individual configuration of series specific settings. showLine, showPoint, showAreaand even the smoothing function can be overridden per series! And guess what? You can even override those series settings in the responsive configuration! Check the example code for more details.