0👍
you need to add this html below
<canvas id="canvas"></canvas>
<progress id="animationProgress" max="1" value="0" style="width: 100%"></progress> // you missed this html
var MONTHS = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
var progress = document.getElementById('animationProgress'); // and missed this
var config = {
type: 'line',
data: {
labels: ["January", "February", "March", "April", "May", "June", "July"],
datasets: []// your dataset
},
options: {
title:{
display:true,
text: "Progress Bar"
},
animation: {
duration: 2000,
onProgress: function(animation) {
//add progress
progress.value = animation.currentStep / animation.numSteps;
},
onComplete: function(animation) {
window.setTimeout(function() {
progress.value = 0;
}, 2000);
}
}
}
};
window.onload = function() {
var ctx = document.getElementById("canvas").getContext("2d");
window.myLine = new Chart(ctx, config);
};
- Chartjs-How to show lables just outside the the doughnut chart in Chartjs?
- Chartjs-Chart.js why are my hover effects not working?
Source:stackexchange.com