title: Making angular-chartjs responsive with UI-Grid
body: <p>I am using angular-chart.js (<a href="http://jtblin.github.io/angular-chart.js/" rel="nofollow">http://jtblin.github.io/angular-chart.js/</a>) module and trying to make the chart data editable with UI-Grid module (<a href="http://ui-grid.info/docs/#/tutorial/201_editable" rel="nofollow">http://ui-grid.info/docs/#/tutorial/201_editable</a>).
  I am able to edit the data but not sure how I can make the chart updated responsively upon editing the cell.
  I am fighting with this for sometime.I'd appreciate any thoughts on this.</p>
  
  <p>Here's what I have got so far:</p>
  
  <pre><code>app.controller("myController", function ($scope) {
  
  $scope.labels = ["January", "February", "March", "April", "May", "June", "July"];
  $scope.series = ['Series A', 'Series B'];
  
  $scope.gridOptions = {
      columnDefs: [
          { name: 'A', width: '50%', enableCellEdit: true },
          { name: 'B', width: '50%', enableCellEdit: true }
      ],
      data: [{
          "A": 65,
          "B": 28
      },
      {
          "A": 59,
          "B": 48
      },
      {
          "A": 80,
          "B": 40
      },
      {
          "A": 81,
          "B": 19
      },
      {
          "A": 56,
          "B": 86
      },
      {
          "A": 55,
          "B": 27
      },
      {
          "A": 40,
          "B": 90
      }
      ]
  };
  
  var seriesA = [];
  for (var i = 0; i &lt; $scope.gridOptions.data.length; i++) {
      seriesA.push($scope.gridOptions.data[i].A);
  }
  
  console.log(seriesA);
  
  var seriesB = [];
  for (var i = 0; i &lt; $scope.gridOptions.data.length; i++) {
      seriesB.push($scope.gridOptions.data[i].B);
  }
  
  console.log(seriesB);
  
  $scope.data = [
          seriesA,
          seriesB
  ];
  
  
  $scope.onClick = function (points, evt) {
      console.log(points, evt);
  };
  });
  </code></pre>
  
  <p>Here's the HTML snippet:</p>
  
  <pre><code>&lt;div id="grid1" class="panel" ui-grid="gridOptions" ui-grid-edit ui-grid-row-edit ui-grid-cellNav class="grid"&gt;&lt;/div&gt;
  &lt;canvas id="line" class="chart chart-line" data="data"
      labels="labels" legend="true" series="series"
      click="onClick"&gt;&lt;/canvas&gt;
  </code></pre>