在函数内部创建图表时，销毁 chart.js 不起作用 - chart.destroy() 不是函数

Posted 2023-03-25

【中文标题】在函数内部创建图表时，销毁 chart.js 不起作用 - chart.destroy() 不是函数

【英文标题】：Destroying chart.js is not working when chart created inside function - chart.destroy() is not a function

【发布时间】：2018-05-07 18:53:00

【问题描述】：

我正在使用一个函数来创建一个使用 chart.js 的图表。 不幸的是，每当我尝试调用 chart.destroy() 时，都会出现错误：

“chart.destroy() 不是函数”。 我的代码如下所示：

  var chart = ;
  createChart(x_axis_data, y_axis_data, chart); //Function creating chart

图表本身是在函数内部创建的：

chart = new Chart(document.getElementById(id),....

图表创建成功。但是，我不能通过调用：chart.destroy 来删除图表。 我已经尝试过使用

window.chart.destroy()

没有任何成功。

【问题讨论】：

好吧，让保存图表的变量成为全局变量，而不是某个函数的局部变量。如果您使用的是 jQuery，您可以在目标 <canvas> 元素上使用 .data("chart") 来获取现有的 Chart 实例（如果有）。

不应该是我的变量已经是全局的吗？我在调用我的函数之前创建它并将它传递给我的函数。

【参考方案1】：

设置window.chart =而不是依赖chart =的隐式函数。如果您在代码中使用严格模式，它应该会引发警告。

【讨论】：

我仍然得到错误：window.chart.destroy 不是函数

我发现了我的错误。我忘了使用：window.chart inside my function

【参考方案2】：

看看这个：https://github.com/chartjs/Chart.js/issues/1007

变化：

var myNewChart1 = new Chart(ctx1).Line(barChartData1, animation: false);

收件人：

window.myNewChart1 = new Chart(ctx1).Line(barChartData1, animation: false);