title: How to display different data on Morris Chart?
body: <p>I have a morris chart loaded with a collection of data.  In each item there are 6 different data values.  I want to toggle between 2 different sets of data.  </p>
  
  <p>As a simple example here is my data of which I want to always display the target and toggle between A/B and A2/B2:</p>
  
  <pre><code>[
  {
  'Target_A':'0',
  'Target_B':'0',
  'A':'12',
  'B':'12',
  'A2':'12',
  'B2':'4',
  'xKeyVal':'2011-12-19'
  },
  {
  'Target_A':'0',
  'Target_B':'0',
  'A':'12',
  'B':'12',
  'A2':'8',
  'B2':'3',
  'xKeyVal':'2012-03-12'
  }
  ]
  </code></pre>
  
  <p>Here is my code to toggle, however it does not work.  I can load either set of data just fine on the page load, but I cannot change it successfully yet.</p>
  
  <pre><code>function ToggleCC(isChecked){ //This is fired from a checkbox
  if(isChecked)
  {
      chart.options.ykeys = ['A2', 'Target_A', 'B2', 'LastTarget_B'];
      chart.options.lables= ['A2', 'Target_A', 'B2', 'LastTarget_B'];
  }
  else
  {
      chart.options.ykeys = ['A', 'Target_A', 'B', 'Target_B'];
      chart.options.labels = ['A', 'Target_A', 'B', 'Target_B'];
  }
  //chart.setData();
  chart.redraw();
  </code></pre>
  
  <p>}</p>
  
  <p>chart is a global variable created in the document.ready function.</p>
  
  <pre><code>$( document ).ready(function() {
      chart = new Morris.Line({
           ...
  </code></pre>
  
  <p>How can I update my keys and labels and 'update' my chart?</p>