title: Charts .js update when array changes
body: <p>I have a relatively simple question about charts.js that I can't get working.</p>
  
  <p>I have a function that makes an ajax call and changes the values of an array after it runs a few calculations.</p>
  
  <p>I want my chart to display each of these values array[0] --> array [9] once the array has updated, but the chart seems to just remain static no matter what I do.</p>
  
  <p>my code:</p>
  
  <p><strong><em>SETUP THE CHART:</em></strong></p>
  
  <pre><code>window.onload = function(){
  var ctx = document.getElementById("canvas").getContext("2d");
  window.myLine = new Chart(ctx).Line(lineChartData, {
      responsive: true
      });
  };
  </code></pre>
  
  <p><strong><em>SETUP THE CHART DATA:</em></strong></p>
  
  <pre><code>var lineChartData = {
      labels : ["1","2","3", "4", "5", "6", "7", "8", "9", "10"],
      datasets : [
          {
              label: "CreepSlain Analysis",
              fillColor : "rgba(40,35,100,0.2)",
              strokeColor : "rgba(0,0,0,1)",
              pointColor : "#FFFFFF",
              pointStrokeColor : "#000000",
              pointHighlightFill : "#000000",
              pointHighlightStroke : "#000000",
              data : [hmcArray[0],hmcArray[1],hmcArray[2],hmcArray[3],hmcArray[4],hmcArray[5],hmcArray[6],hmcArray[7],hmcArray[8],hmcArray[9]]
          }
      ]
  };
  </code></pre>
  
  <p><strong><em>THE CHART'S APPEARANCE WHEN ARRAY IS EMPTY:</em></strong></p>
  
  <p><a href="https://i.stack.imgur.com/qenDd.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/qenDd.png" alt="enter image description here"></a></p>
  
  <p><strong><em>CODE TO CALCULATE VALUES OF HMC ARRAY:</em></strong></p>
  
  <pre><code>function calculateHmc(aF,bF,cF,dF,eF,fF,gF,n) {
  
      var pvpFactor = ((aF * killArray[n]) + (bF * assistArray[n])) / (cF * deathArray[n]);
      pvpFactor = pvpFactor.toFixed(2);
      pvpFactorArray.push(pvpFactor);
      var pveFactor = ((dF * csArray[n]) + (eF * jungleCSArray[n]) + (fF * counterJungleCSArray[n])) / ((gameTimeArray[n])/60);
      pveFactor = pveFactor.toFixed(2);
      pveFactorArray.push(pveFactor);
      var auxFactor = (gF * crowdControlArray[n]);
      auxFactor = auxFactor.toFixed(2);
      auxFactorArray.push(auxFactor);
  
      var rawHMC = (0.8 * pvpFactor) + (0.4 * pveFactor) + (2.5 * auxFactor);
      hmcArray.push(rawHMC);
  
  //The array gets updated with hmcArray.push(rawHMC);
  
  ... continued
  </code></pre>
  
  <p><strong><em>CHART'S APPEARANCE AFTER ARRAY IS UPDATED:</em></strong></p>
  
  <p><a href="https://i.stack.imgur.com/nnY1V.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/nnY1V.png" alt="enter image description here"></a></p>
  
  <p>Do I have to run some sort of function that will re-draw the chart? And if so, how do I do this?</p>
  
  <p>Thanks so much for any help!</p>