Chartist.js is the product of a community that was disappointed about the abilities provided by other charting libraries.

1. Required Vendor file

<link rel="stylesheet" href="chartist.min.css">
<script src="chartist.min.js"></script>

2. Required Template Specific File

<link rel="stylesheet" href="chart-chartist.css">

3. Binding to existing DOM element

<div class="line-area-chart"></div>

4. Basic usage may look something like this

// Initialization
new Chartist.Line('.line-area-chart', {
  labels: [1, 2, 3, 4, 5, 6, 7, 8],
  series: [
    [5, 9, 7, 8, 5, 3, 5, 4]
  ]
}, {
  low: 0,
  showArea: true
});

5. Customization

As per your requirement, you can customize chartist using js and/or css/scss.

Refer more chart configuration options from here

Refer following links for detailed documentation, configuration options, methods and examples: