2014-01-27 179 views
29

我在使用charts.js關閉動畫時遇到了一些問題。使用Charts.js禁用動畫

這是我的代碼:

var pieData = [ 
    { 
     value: 30, 
     color:"#F38630" 
    }, 
    { 
     value : 50, 
     color : "#E0E4CC" 
    }, 
    { 
     value : 100, 
     color : "#69D2E7" 
    }  
]; 

var myPie = new Chart(document.getElementById("canvas").getContext("2d")).Pie(pieData); 

誰能提供一個例子嗎?

回答

51
var pieData = [{ 
    value: 30, 
    color: "#F38630" 
}, 
{ 
    value: 50, 
    color: "#E0E4CC" 
}, 
{ 
    value: 100, 
    color: "#69D2E7" 
}]; 

var pieOptions = { 
    animation: false 
}; 

var ctx = document.getElementById("canvas").getContext("2d"); 
var myPie = new Chart(ctx).Pie(pieData, pieOptions); 

這應該工作;)

+1

哪裏是'options.animation'的文檔中列出? http://www.chartjs.org/docs/latest/general/options.html和http://www.chartjs.org/docs/latest/configuration/animations.html都沒有提到布爾「動畫」屬性。 – Dai

+0

@戴不要比較4歲的答案與當前的文檔。 – Skrzypek

+0

但你的答案適用於當前版本的ChartJS,這就是爲什麼我給你一個upvote。 Sugoi Sugoi, – Dai

6

爲了防止讀取所有接受的答案,回答的是具體的例子,來禁用圖表JS動畫:

在你的選擇初始化的時候傳遞一個對象特定的圖表類型並使用以下鍵/值對:animation: false。例如myChart.Bar(myCanvas, {animation:false});

23
options: { 
    animation: { 
     duration: 0 
    } 
} 
0

這應該做的伎倆:

chartOption = { 
     animation:{ 
      duration: 0 
     } 
    }