图表js更新多个图表

时间:2017-07-04 09:45:59

标签: javascript html5-canvas chart.js dashboard

我已经看过很多关于如何在chart.js中添加数据的教程,但它只适用于单个图表。

我使用chartjs创建多个图表(每个图表都有自己的带有唯一ID的画布)。 例如:图表1位于画布中,其id =“c1”,而图表2位于画布中,其id =“c2”。如何选择图表1并添加新数据?

1 个答案:

答案 0 :(得分:0)

如果只有两个图表,则可以创建两个不同的Chart对象,并通过它们的对象来处理各个图表。

ctx1 = document.getElementById("c1");
ctx2 = document.getElementById("c2");
myPieChart = new Chart(ctx, {
              type: 'pie',
              data: data1
            });
myLineChart = new Chart(ctx, {
              type: 'line',
              data: data1
            });

要将新数据动态添加到现有图表中,

function updateChart(newData){
    var length = myLineChart.options.data[0].dataPoints.length;
    chart.options.data[0].dataPoints.push({ y: newData});
    chart.render();
}