title: Chartjs - my old data show sometimes, bugs?
body: <p>I have problem is kinda weird, well i have filter, if i picked filter date and ftycode on first time, is show my data on chart. But when i change my filter, is kinda bug, well is reloading or update my data on chart but when i'm hover the chart sometimes my old data chart still show. 
  This my coding</p>
  
  <pre><code>var data = {
      labels: countline,
      datasets: [
          {
              label: 'QTY Target',
              fillColor: 'rgba(220,220,220,0.5)',
              strokeColor: 'rgba(220,220,220,0.8)',
              highlightFill: 'rgba(220,220,220,0.75)',
              highlightStroke: 'rgba(220,220,220,1)',
              data: countqtytarget
          },
          {
              label: 'Qty Sewing',
              fillColor: 'rgba(151,187,205,0.5)',
              strokeColor: 'rgba(151,187,205,0.8)',
              highlightFill: 'rgba(151,187,205,0.75)',
              highlightStroke: 'rgba(151,187,205,1)',
              data: countsew
          },
          {
              label: 'Qty QC Output',
              fillColor: 'rgba(255,0,0,0.2)',
              strokeColor: 'rgba(255,0,0,1)',
              highlightFill: 'rgba(255,0,0,1)',
              highlightStroke: 'rgba(255,0,0,1)',
              data: countqc
          },
          {
              label: 'Qty Right First Time (RFT)',
              fillColor: 'rgba(57,10,150,0.2)',
              strokeColor: 'rgba(76,34,160,1)',
              highlightFill: 'rgba(76,34,160,1)',
              highlightStroke: 'rgba(76,34,160,1)',
              data: countrft
          },
          {
              label: 'Qty Repair (RPR)',
              fillColor: 'rgba(227,255,0,0.2)',
              strokeColor: 'rgba(241,255,127,1)',
              highlightFill: 'rgba(241,255,127,1)',
              highlightStroke: 'rgba(241,255,127,1)',
              data: countrpr
          },
          {
              label: 'Qty Polly Bag',
              fillColor: 'rgba(71,180,2,0.2)',
              strokeColor: 'rgba(241,255,127,1)',
              highlightFill: 'rgba(241,255,127,1)',
              highlightStroke: 'rgba(241,255,127,1)',
              data: countpolly
          }]
  };
  
  // Chart.js Options
  var options = {
      maintainAspectRatio: false,
  
      // Sets the chart to be responsive
      responsive: true,
  
      //Boolean - Whether the scale should start at zero, or an order of magnitude down from the lowest value
      scaleBeginAtZero: true,
  
      //Boolean - Whether grid lines are shown across the chart
      scaleShowGridLines: true,
  
      //String - Colour of the grid lines
      scaleGridLineColor: "rgba(0,0,0,.05)",
  
      //Number - Width of the grid lines
      scaleGridLineWidth: 1,
  
      //Boolean - If there is a stroke on each bar
      barShowStroke: true,
  
      //Number - Pixel width of the bar stroke
      barStrokeWidth: 2,
  
      //Number - Spacing between each of the X value sets
      barValueSpacing: 5,
  
      //Number - Spacing between data sets within X values
      barDatasetSpacing: 1,
  
      //String - A legend template
      legendTemplate: '&lt;ul class="tc-chart-js-legend"&gt;&lt;% for (var i=0; i&lt;datasets.length; i++){%&gt;&lt;li&gt;&lt;span style="background-color:&lt;%=datasets[i].fillColor%&gt;"&gt;&lt;/span&gt;&lt;%if(datasets[i].label){%&gt;&lt;%=datasets[i].label%&gt;&lt;%}%&gt;&lt;/li&gt;&lt;%}%&gt;&lt;/ul&gt;'
  };
  // Get context with jQuery - using jQuery's .get() method.
  $('#rchart2')
      .empty(); // this is my &lt;canvas&gt; element
  $('#canvas')
      .append('&lt;canvas id="chart2" class="full-width"&gt;&lt;/canvas&gt;');
  var ctx = $("#chart2")
      .get(0)
      .getContext("2d");
  // This will get the first returned node in the jQuery collection.
  var chart2 = new Chart(ctx)
      .Bar(data, options);
  //generate the legend
  var legend = chart2.generateLegend();
  //and append it to your page somewhere
  $('#chart1Legend')
      .empty();
  $('#chart2Legend')
      .append(legend);
  </code></pre>