Chartjs圆环图倒计时平滑动画

Question

我正在使用 Chart.js 中的圆环图来显示 60 秒计时器图表。

Gif：https://imgur.com/UmhqzuO

options = {
    tooltips: {enabled: false},
    cutoutPercentage: 75,
    animation: {duration: 1}
};

data = {
    datasets: [
        {
            data: [this.percentage, 100 - this.percentage],
            backgroundColor: [this.color, this.fillColor]
        },
    ]
};

每一秒，我都会更新图表以反映秒数。计时器从 60 秒开始，一直到 0。当前的动画感觉就像在滴答作响。我希望动画看起来像一个清扫时钟而不是滴答作响。

如何实现扫动动画？由于图表每秒钟都会重新绘制，我如何才能保持最后一个位置并从该位置更新？

Answer 1

我使用

实现了这一点

        const data = this.getDataSet();
        this.doughnut.chart.data.datasets[0].backgroundColor = data.backgroundColor;
        this.doughnut.chart.data.datasets[0].data = data.data;
        this.doughnut.chart.update();