在不同的函数中访问图表

Question

我正在使用 chart.js

渲染图表

是否可以通过 canvas 对象访问不同函数中的图表？如果单击某个按钮，我想更新它。

谢谢！

Answer 1

对于像这样初始化的图表

var myNewChart = new Chart(ctx).Line(data);

myNewChart.chart.canvas 是您的 canvas 对象。请注意，您必须处理因工具提示显示/移除、动画（初始绘制，如果启用）和图表大小调整而发生的重绘。

虽然您也可以使用 document.getElementById("myId") 访问 canvas 并使用 document.getElementById("myId").getContext("2d") 访问上下文，但您将无法访问 .update()、.addData 等图表函数() 等。为此，您需要图表实例。

由于每个可用的图表实例也存储在 Chart.instances 中（并且由于图表是全局的），您可以这样做

for (instance in Chart.instances) { 
    if (Chart.instances[instance].chart.canvas === document.getElementById("myId")) {
        console.log("found my chart instance")
        console.log(Chart.instances[instance])
    }
}

获取图表实例。

在不同的函数中访问图表

Access a chart in a different function

html

javascript

chart.js