Question

我在我的webapp中使用图表，为此我使用角度图表。图表的html文件是

    <canvas id="pie" class="chart chart-pie" chart-data="data"
    chart-labels="labels">
    </canvas>

，其控制器文件为

    angular.module('myApp')
    .controller('myController', function ($scope) { 

    $scope.labels = ["Download Sales", "In-Store Sales", "Mail-Order Sales"];
    $scope.data = [300, 500, 100];
    });

现在我只想知道如何动态地将数据添加到此饼图中。

提前致谢

Answer 1

您可能有一个按钮，当您单击填充图表所绑定的阵列时。

$scope.onClick = function(item,label)
{
  //item and label can come from anywhere, i just add here as parameters to illustrate as example
  $scope.data.push(item);
  $scope.labels.push(label);
}

Answer 2

要将动态数据添加到图表，您必须将数据推送到数据数组和标签数组。

注意：数据数组实际上不是数组，它是数组中的数组。因此，数据不是[]，而是[[]]。

使其运作的代码：

如果使用$ scope：$scope.data[0].push(data) and also $scope.labels.push(label)
如果使用vm：vm.data[0].push(data) and also vm.labels.push(label)

以角度js动态添加数据到图表

2 个答案: