如何在单击事件处理程序中使用ChartJS对象？

Question

我在仪表板页面上绘制了3个ChartJS对象。我也在饼图的同一页面中使用echarts.js。我在饼图上有一个点击事件，其中在ChartJS图表上绘制了每个饼的点击事件的不同数据。所以我在饼图的点击事件中使用ChartJS对象。但是ChartJS对象在处理程序中变得未定义，即使我在全局中定义它。我得到了destroy（）的错误，因为“Uncaught TypeError：无法读取未定义的属性'destroy'”。

我的问题是如何在echarts点击事件处理程序中访问ChartJS对象？

请参考下面的代码示例：

pie.on('click', function (params) { //pie is the object of echart 
  console.log(myChart);//printing myChart results "undefined" in console
  var thatState = params.name;
  myChart.destroy();
  waitChart.destroy();
  myBarChart.destroy();
  console.log("destroyed!");

  //myChart,waitChart,myBarChart are the objects of 
  // chartJS. I'm destroying those to redraw the charts with new data on 
  // click event of pies.
..............
........
});

Answer 1

首先，确保它真的是全球性的：

console.log(window.myChart);

---

1：尝试以某种方式将其作为参数传递（如果可能）：

pie.on('click', function(params, myChart) {
    console.log(myChart);
});

2：尝试使用ES6箭头表示法，以便能够访问功能块之外的范围：

pie.on('click', (params) => {
    console.log(window.myChart);
});

3：将其映射到this，并在功能块中访问它：

this.myChart = myChart || window.myChart;
pie.on('click', (params) => {
    console.log(this.myChart);
});