title: Chartjs cannot read property datasets of undefined
body: <p>I'm developing a React app and trying to get Chartjs to work having imported it from its npm package. The following is the initialization code:</p>
  
  <pre><code>//in my constructor
  this.usageChart = null;
  
  //in componentDidMount
  let chartContext = document.getElementById("proc_usage");
  let initialDataIdle = [100, 100, 100, 100, 100, 100, 100, 100, 100, 100];
  let initialDataOther = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
  
  console.log("Creating chart");
  this.usageChart = new Chart(chartContext, {
    type: "line",
    data: {
      datasets: [
        { label: "User", fill: true, data: initialDataOther, backgroundColor: "rgba(244, 143, 177, 0.8)" },
        { label: "System", fill: true, data: initialDataOther, backgroundColor: "rgba(255, 235, 59, 0.8)" },
        { label: "IRQ", fill: true, data: initialDataOther, backgroundColor: "rgba(100, 181, 246, 0.8)" },
        { label: "Idle", fill: true, data: initialDataIdle, backgroundColor: "rgba(150, 150, 150, 0.4)" }
      ]
    },
    options: {
      scales: {
        xAxes: [{ stacked: true }],
        yAxes: [{ stacked: true }]
      },
      plugins: {
        stacked100: { enable: true }
      }
    }
  });
  console.log("Chart created: " + this.usageChart.data);
  </code></pre>
  
  <p>The problem is when I try to update the chart, <code>this.usageChart.data</code> is undefined. In fact, in that last <code>console.log()</code> call during initialization, it is also undefined. I cannot see what I am doing wrong. I am loading a plugin which allows a Line chart to be drawn as stacked with area between lines representing percentage. I don't know if perhaps this plugin is the issue, but I am getting no errors about it and the code was more or less taken verbatim from the plugin's example code.</p>
  
  <p>Here is the code where I update the chart:</p>
  
  <pre><code>//from componentDidUpdate
  usages['User'] = userUsage;
  usages['System'] = sysUsage;
  usages['IRQ'] = irqUsage;
  usages['Idle'] = idleUsage;
  
  console.log("updating chart");
  this.usageChart.data.datasets.forEach((dataset) =&gt; {
    dataset.data.shift();
    dataset.data.push(usages[dataset.label]);
  });
  this.usageChart.update();
  console.log("chart updated");
  </code></pre>