logo标签列表

如何使用Chart.js绘制从左到右的线条动画折线图？

chart.js
3
我正在使用chartjs插件实现线状图。当加载时，我的线状图是从底部到顶部绘制的。我希望将这些线条从左到右进行动画处理。如何更改？
1个回答
4
您可以通过 initialize 方法来扩展图表并覆盖动画的起始值，如下所示：
Chart.types.Line.extend({
    name: "LineAlt",
    initialize: function(data){
        Chart.types.Line.prototype.initialize.apply(this, arguments);
        this.eachPoints(function(point, index){
            Chart.helpers.extend(point, {
                x: this.scale.calculateX(0),
                y: this.scale.calculateY(point.value)
            });
            point.save();
        }, this);       
    }
});

那么就使用扩展图表，像这样：
...
new Chart(ctx).LineAlt(data);

Fiddle - http://jsfiddle.net/kLg5ntou/

非常感谢，这真的帮了我很多。现在线条按照预期从左到右绘制。 - undefined
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接