使用角图-js的空白画布

时间:2017-05-06 19:06:21

标签: javascript angularjs canvas angular-chart

索引页面为空白。 cosole.log中没有错误但仍然没有渲染画布。有丢失的文件吗?像angular chart-css。

这是index.html

var app = angular.module('myapp', ['chart.js']); 
app.controller('MainCtrl', function($scope) {
    $scope.graph = {};

 
  $scope.graph.data = [[1, 2, 3, 4, 5, 6, 7, 8]];
  $scope.graph.labels = ['hoi', 'doei', 'hallo', 'hee', 'hoi', 'doei', 'hallo', 'hee'];
  $scope.graph.options = {
    animation: false
  };
  $scope.graph.series = ['Series']
  // $scope.graph.colours;
  $scope.graph.legend = true;
});
<!DOCTYPE html>
<html ng-app="myapp">
  <head>
    <meta charset="utf-8" />
    <link href="ag.css" rel="stylesheet">
    <script src="https://code.angularjs.org/1.4.0-rc.0/angular.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.5.0/Chart.min.js"></script>
    <script src="https://cdn.jsdelivr.net/angular.chartjs/latest/angular-chart.min.js"></script>
    <script src="main.js"></script>
  </head>
  <body ng-controller="MainCtrl">
    <div class="chart-container">
      <canvas 
        class="chart chart-line"
        data="graph.data"
        labels="graph.labels"
        series="graph.series"
        options="graph.options"
        legend="graph.legend"
        >
      </canvas>   
    </div>
  </body>
</html>

0 个答案:

没有答案