我在哪里使用chartjs的销毁功能?

时间:2018-04-13 13:56:54

标签: javascript vue.js chart.js

我正在使用VueJS。

当我将图表悬停在图表上时,我的图表在两个条形图之间堆叠和跳跃有问题,它在两个不同的图表之间轻弹。

我已经了解了.destroy()内置函数,但我不知道在哪里调用它。每当我尝试使用它时,它表示我的图表未定义。这是我用来渲染图表的代码:

  var ctx = document.getElementById("month-visits-chart").getContext('2d');

  myBarChart = new Chart(ctx, {
    type: 'bar',
    data: {
      labels: dayMonth,
      backgroundColor: '#FFFFFF',
      backgroundColor: '#FFFFFF',
      datasets: [{
        label: 'Visits per day per for ' + this.monthName,
        data: visits,
        backgroundColor: '#CC0033',
        borderColor: [
        ],
        borderWidth: 1
      }]
    },
    options: {
      'onClick' : (evt, item) => {
        var day = item[0]['_model'].label
        this.selectedDay = day
        this.renderHourlyBarChart();
      },
      title: {
        display: true,
        text: 'Visits per day per for ' + this.monthName
      },
      scales: {
        yAxes: [{
          ticks: {
            beginAtZero:true
          },
          scaleLabel: {
            display: true,
            labelString: 'Visits'
          }
        }],
        xAxes: [{
          scaleLabel: {
            display: true,
            labelString: 'Day'
          }
        }]
      }
    }
  });
},

我在哪里使用.destroy()函数会使它不被返回undefined?

1 个答案:

答案 0 :(得分:1)

当您在下拉框中更改选项时,应该在.destroy()变量上调用myBarChart