0👍
The onAnimationProgress
has 2 parameters easeDecimal
and stepDecimal
that you can use
var myLineChart = new Chart(ctx).Line(data, {
onAnimationProgress: function (easeDecimal, stepDecimal) {
// stepDecimal proceeds uniformly from 0 to 1
// easeDecimal proceeds depending on the easing function from 0 to 1
console.log(stepDecimal)
}
});
For instance, to change the fillColor
– here I just adjust the transparency
var myLineChart = new Chart(ctx).Line(data, {
animationSteps: 200,
onAnimationProgress: function (easeDecimal, stepDecimal) {
this.datasets[0].fillColor = "rgba(120,120,120," + stepDecimal + ")";
}
});
- Chartjs-Chart.js chart won't animate inside of bootstrap carousel
- Chartjs-Chartjs custom colors not displaying when dataset is changed
Source:stackexchange.com