title: Chart.js: Dynamic Changing of Chart Type (Line to Bar as Example)
body: <p>I am trying to hot swap chart types based on select box changes. If data needs to be updated, it changes.</p>
  
  <p>So for example, on page load I create a chart like this:</p>
  
  <pre><code>var config = {
       type: 'line',
       data: {
          labels: this.labels,
          datasets: [{
              label: 'Some Label',
              data: this.values
          }]
       },
       options: {
           responsive: true
       }
  }
  var context = document.getElementById('canvas').getContext('2d');
  window.mychart = new Chart(context, config);
  </code></pre>
  
  <p>But then I change the combo box to a bar chart. I have tested the data with bar chart on page load, and it worked great.</p>
  
  <p>Here's how I am trying to change the chart.</p>
  
  <pre><code>window.mychart.destroy();
  
  // chartType = 'bar'
  config.type = chartType;
  
  var context = document.getElementById('canvas').getContext('2d');
  window.mychart = new Chart(context, config);
  
  window.mychart.update();
  window.mychart.render();
  </code></pre>
  
  <p>But nothing happens. The line chart remains. How can I dynamically change the chart type? (Even if it means destroying &amp; re-creating the chart canvas).</p>
  
  <p><strong>UPDATE</strong> </p>
  
  <p>Note it looks like it is actually destroying the chart, but keeps redrawing a line chart, even though I do <code>console.log(config.type);</code> and it returns <code>bar</code>, not <code>line</code></p>