[Chartjs]-Angular-Chart not rendering anything

by

8👍

✅

You don’t have to use {{}} when it’s data from the scope, so you have to change like this :

<canvas 
    class="chart chart-line"
    data="graph.data"
    labels="graph.labels"
    series="graph.series"
    options="graph.options"
    legend="graph.legend"
    ng-show="graph.visible">
  </canvas>

Furthermore, data should be an array of array like

$scope.graph.data = [[1, 2, 3, 4, 5, 6, 7, 8]];

See the working Plunker here (fixed by Grundy in the comments) : http://plnkr.co/edit/xQ42shTY6qrteNXOYX2F?p=preview

9👍

Adding following div container over the canvas solved the problem for me,
check the following:

<div class="chart-container" ng-show="graph.visible">
  <canvas #myChart class="my-4" width="900" height="380"></canvas>
</div>

Leave a comment