使用计时器时,角图无法实时更新图表

时间:2018-06-28 19:40:45

标签: angularjs chart.js angular-chart

我开始在angularjs上使用angular-chart.js进行实验。

我能够从初始数据中绘制图表,但是当我使用计时器更改数据时,图表不会实时更新。

原始的chart.js库具有一个chart.update()函数来更新该图表,我似乎无法在angularjs中找到类似的东西。

这是我到目前为止所拥有的

控制器

$scope.value1 = 87;
$scope.value2 = 25;

$scope.pie2_labels = ["Total Staff", "Available Labor Pool"];
$scope.pie2_data = [$scope.value1,$scope.value2];

setInterval(function(){ $scope.value2 = $scope.value2 + 1;
$scope.pie2_data = [$scope.value1, $scope.value2];
});

$scope.pie2_colors = [{backgroundColor:"rgba(255,99,132,1)",pointBackgroundColor: "rgba(255,99,132,0.2)"},{backgroundColor: "rgba(75,192,192,1)",pointBackgroundColor: "rgba(75,192,192,0.2)"}];
$scope.pie2_options = { global: { responsive: true }, legend: { display: true, position: 'top' }, title: {display: true, text: 'Staffing'} };

HTML

<canvas id="pie2" class="chart chart-pie" chart-data="pie2_data" chart-labels="pie2_labels" chart-colors="pie2_colors" chart-options="pie2_options" width="400" height="400"></canvas>

我假设angular的双向绑定会自动更新它没有做的图表。我在console.log上看到了更新的值,但是图中没有变化。

谢谢。

0 个答案:

没有答案