Chart js 更新多个图表

Posted 2023-03-25

【中文标题】Chart js 更新多个图表

【英文标题】：Chart js update multiple charts

【发布时间】：2017-12-07 17:20:29

【问题描述】：

我看过很多关于如何在chart.js中添加数据的教程，但都是针对单个图表的。

我使用 chartjs 创建多个图表（每个图表都有自己的画布和唯一的 ID）。 例如：图表 1 位于 id="c1" 的画布中，图表 2 位于 id="c2" 的画布中。如何选择图表 1 并添加新数据？

【参考方案1】：

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

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();