Chart.js在滚动上动画

我正在使用chart.js但我也想在滚动时显示图表。

我正在使用此代码： DEMO 1

var doughnutData = [ { value: 30, color:"#F7464A" }, { value : 120, color : "#4D5360" } ]; var myDoughnut = new Chart(document.getElementById("canvas").getContext("2d")).Doughnut(doughnutData); 

但它总是出现，而不是滚动。

看起来很奇怪我看到这个小提琴取得了成效： DEMO 2

但是将以下代码更新为我的第一个演示不起作用： DEMO 1 UPDATED

Answer 1

doughnutData而不是data

 new Chart(document.getElementById("canvas").getContext("2d")).Pie(doughnutData); 

的jsfiddle

如果你需要doghnut：

的jsfiddle

Answer 2

如果您不希望重新启动每个滚动，请尝试以下操作：

 $(window).bind("scroll", function(){ $('.startChart').each(function(i){ var options = { animationEasing: 'easeOutQuart', animationSteps: 150, segmentShowStroke: true, segmentStrokeColor: 'FFF' }; var doughnutData = [ {value: 30, color:"#F7464A"}, {value : 120,color : "#4D5360"} ]; var myDoughnut = new Chart(document.getElementById("canvas").getContext("2d")).Doughnut(doughnutData, options); $(window).unbind(i); }); }); 

http://jsfiddle.net/MU9aw/74/