Question

我已经用chart.js创建了一个图表。但图表需要使用dinamic数据。我的数据有一个对象。我需要为每个索引创建一个图表。我的目标是：

var example = [ [project{ data:['24/12/1994','25/12/1994'] qtd: [1,5]},
project{ data:['24/12/1994','25/12/1994'] qtd: [1,5]} ];

因此，对于每个项目，我需要一个图表，并且每次都可以有更多的项目，所以它需要是动态的。但我只知道将数据放在带有$ scope的图表中所以我该怎么做？任何的想法？

我真的很感激帮助。

如果有帮助，这是我的HTML：

  <div class="chart-container">
    <canvas id="line" class="chart chart-line" chart-data="data" chart-labels="labels" chart-series="series" chart-options="options" chart-dataset-override="datasetOverride" chart-click="onClick">
    </canvas> 
  </div>

Answer 1

首先，我相信您的数据会是这样的，

var example = [{
                  project: {data:['24/12/1994','25/12/1994'], qtd: [1,5]
               },{
                  project: {data:['24/12/1994','25/12/1994'], qtd: [1,5]
               }];

您发布的对象格式有误。

为此，首先需要将整个数据保存在$ scope中，如

$scope.chartData = example; //example is what we defined above or your response

你需要在HTML中重新显示画布以显示每个图表。

  <div class="chart-container">
    <canvas 
            ng-repeat="data in chartData"
            chart-data="{{data}}"
            id="line" class="chart chart-line"
            chart-labels="labels"
            chart-series="series" chart-options="options"
            chart-dataset-override="datasetOverride"
            chart-click="onClick">
    </canvas> 
  </div>

我在data中传递了chart-data="{{data}}"，猜测你需要传递对象数组中的每个对象。

如果您只想在每个对象中传递项目对象，那么 chart-data="{{data.project}}"

对于qtd对象

，

和chart-data="{{data.qtd}}"

如何使用角度在同一页面上创建多个图表？

1 个答案: