Javascript 每次更新数据时，Firebase web都会不断复制apexchart

嘿，我正在使用javascript和ApexCharts绘制一个图表，该图表从firebase获取数据，但每次数据在firebase中更改，而不是替换图表或更新图表，它都会在其下添加新图表

这是密码

function dailyTracking(){ 
var query = firebase.database().ref('Facilities').on('value', function(snapshot) {

var options = {
  chart: {
      height: 380,


      width: "100%",
      type: "bar",
      stacked: false
  },
  series: [
      {
          name: "Library",
          data: snapshotToArray(snapshot.child('Library'))
      },
      {
          name: "Canteen",
          data: [5]
      },
      {
          name: "Free Lab",
          data: [42]
      }
  ],
  xaxis: {
    labels: {
      formatter: function (value, timestamp) {
        return new Date() // The formatter function overrides format property
      }, 
    }
  }
};

var chart = new ApexCharts(document.querySelector("#chart"), options);

chart.render();
query.off();
return snapshotToArray(snapshot);});}

---

尽量不要在事件中包装

chart.render（）

调用。渲染图表一次，并在通过调用获取新数据时调用更新事件。我通过添加这一行解决了这个问题

在呈现图表之前

---

在同一事件中进行渲染时，如果存在图表，应首先调用

chart.destroy（）

，以防止重复。感谢您，在使用InnerHtml进行渲染之前清除图表的容器可以解决此问题

chart.destroy（）函数也会执行相同的操作，防止内存泄漏的任何可能性。我建议通过检查
if（！chart）chart.destroy（）
来使用chart.destroy（），以确保安全：）
document.getElementById('chart').innerHTML = '';