Search code examples
javascriptangularjschartsionic-frameworkangular-chartist.js

Simple ChartJS Ionic Example - Gone Wrong


I am trying to run a simple example of ionic with chartjs. Here is my Controller, I have added chart.js to my app.js, and the second is my graph.html page. I just get a blank white screen...

var app = angular.module('app', ['ionic','ngCordova','chart.js']);
app.controller('graphCtrl', function ($scope) {
   $scope.labels = ["Book1", "Book2", "Book3"];
  $scope.data = [300, 500, 100];
});


<ion-view view-title="Outline">
<ion-content>
    <canvas id="radar" class="chart chart-radar"
            chart-data="data" chart-labels="labels">
    </canvas>
    </ion-content> 

</ion-view>

enter image description here


Solution

  • Have you seen the documentation for this?

    https://github.com/jtblin/angular-chart.js

    Ionic is built upon angular, so angular-js plugins normally do work well with ionic. U might been missing a few dependencies or wrong syntax.