title: Chart js shows old chart data when hover
body: <p>I was having some trouble with doughnut chart by using chart.js. The problem is when I update the graph, and when I hover over the graph, sometimes it shows the old chart. Here is where I call the function to plot chart:</p>
  
  <pre><code>&lt;select class="form-control" id="ddlCategory" onchange="plotChart()"&gt;     
  &lt;/select&gt;
  
  function plotChart(){
  // removed code to retrieve data from firebase
  var chart;
  var ctx = document.getElementById('donutChart').getContext("2d");
  var data = {};
  var opt = {
            type: "doughnut",
            data: data,
            options: options
          };
  
          if (chart) {
              chart.destroy();
              chart.clear();
          }else{
              chart = new Chart(ctx,opt);
          }
  for(var i = 0; i &lt; labelData.length; i++){
          chart.config.data.labels.push(labelData[i]);
      }
  chart.update();
  }
  </code></pre>
  
  <p>I tried to destroy the previous chart before I update it but to no avail. Any ideas?</p>