Simple line chart
Three series, Monday to Friday, stretched to the full width.
src/main.ts
import 'chartist/styles.css';
import { lineChart } from 'chartist';
lineChart(
'#chart',
{
labels: ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday'],
series: [
[12, 9, 7, 8, 5],
[2, 1, 3.5, 7, 3],
[1, 3, 4, 5, 6]
]
},
{
fullWidth: true,
chartPadding: {
right: 40
}
}
);import 'chartist/styles.css';
import { LineChart } from 'chartist';
new LineChart(
'#chart',
{
labels: ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday'],
series: [
[12, 9, 7, 8, 5],
[2, 1, 3.5, 7, 3],
[1, 3, 4, 5, 6]
]
},
{
fullWidth: true,
chartPadding: {
right: 40
}
}
); Live
Open in the playgroundView as MarkdownSwitch to 1.x above the code to see the same chart written with the Chartist 1.x classes.