2👍
You can set spangaps to true:
const options = {
type: 'line',
data: {
labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"],
datasets: [{
label: '# of Votes',
data: [12, 19, 3, null, 2, 3],
borderColor: 'pink',
fill: false,
spanGaps: true
},
{
label: '# of Points',
data: [7, null, null, 8, 3, 7],
borderColor: 'orange',
fill: false,
spanGaps: true
}
]
},
options: {}
}
const ctx = document.getElementById('chartJSContainer').getContext('2d');
new Chart(ctx, options);
<body>
<canvas id="chartJSContainer" width="600" height="400"></canvas>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.4/Chart.js"></script>
</body>
- [Chartjs]-Chart.js shaded regions
- [Chartjs]-Chart.js 2 – Is it possible to format tick labels with HTML?
0👍
You should change spanGaps: true
to spanGaps: false
.
https://www.chartjs.org/docs/latest/charts/line.html#line-styling
Source:stackexchange.com