角度图表 - 更改图表的颜色

Question

目前我正在使用Angular Chart API生成图表

Angular Chart

这里我使用下面的选项来显示图形中的颜色但它没有按预期工作你能帮忙吗，这里有什么问题（我也附上了图片）

我想为PieChart的每个部分获得不同的颜色

控制器

app.controller('PieCtrl', function($scope, myservice) {
  $scope.$on('values', function(event, data) {
    $scope.releasename = data.b;
    console.log(data);
    $scope.colors=['#803690', '#00ADF9', '#DCDCDC', '#46BFBD', '#FDB45C', '#949FB1', '#4D5360'];
    $scope.labels = data.b;
    $scope.series = ['My Series'];
    $scope.data = [
      data.c
    ];
  });
});

Canvas HTML

<div ng-controller="PieCtrl" class="col-md-3">
<canvas id="data" class="chart chart-pie" width="500px" height="200px" chart-data="data" chart-labels="labels" chart-colors="colors">
        chart-series="series"
</canvas>
</div>

实际图表为

预期图表

Answer 1

您可以使用 datasetOverride 属性为饼图设置不同的颜色。

<强> HTML

<div ng-controller="PieCtrl" class="col-md-3">
<canvas id="data" class="chart chart-pie" width="500px" height="200px" chart-data="data" chart-labels="labels" chart-dataset-override="datasetOverride">
        chart-series="series"
</canvas>
</div>

<强>控制器

app.controller('PieCtrl', function($scope, myservice) {
   $scope.$on('values', function(event, data) {
      $scope.releasename = data.b;
      $scope.labels = data.b;
      $scope.series = ['My Series'];
      $scope.data = [
         data.c
      ];
      $scope.datasetOverride = [{
         backgroundColor: ['#803690', '#00ADF9', '#DCDCDC', '#46BFBD', '#FDB45C', '#949FB1', '#4D5360']
      }];
   });
});