Javascript 如何在angular-chart.js中设置饼图颜色

我正在angular charts.js中玩饼图。我已经做了，以便我可以设置数据和标签。每当从“饼图”项列表中添加或删除某些内容时，都会执行观察者函数

可以识别标签和数据，但不能识别颜色。我试过几种不同的拼写

app.controller("PieCtrl", function ($scope, $timeout, pieItems) {
    $scope.labels = pieItems.labelsItems();
    $scope.data = pieItems.data();


    function watcherFunction(newData) {
        $scope.labels = pieItems.labelsItems(); //just an array of strings. 
        $scope.data = pieItems.data(); //just an array of number values

        $scope.colours = ["rgba(224, 108, 112, 1)",
            "rgba(224, 108, 112, 1)",
            "rgba(224, 108, 112, 1)"] //not working

        $scope.colors = ["rgba(224, 108, 112, 1)",
            "rgba(224, 108, 112, 1)",
            "rgba(224, 108, 112, 1)"] //also not working

    }

    $scope.$watch(pieItems.list, watcherFunction, true);
    $scope.$watch(pieItems.getTitle, watcherFunction, true);

});

它似乎为切片生成随机颜色。我想推翻这一点。肯定有可能做到这一点吗？

你的JS：

$scope.colours = ["rgba(224, 108, 112, 1)",
            "rgba(224, 108, 112, 1)",
            "rgba(224, 108, 112, 1)"]

您的指令标记：

<canvas id="pie" class="chart chart-pie" chart-colours="colours"></canvas>

对于1.x版 对象实例或简单RGBA值作为字符串有两种方式：

colors = ["rgba(159,204,0,0.5)","rgba(250,109,33,0.7)","rgba(154,154,154,0.5)"];

colors = [
        {
            backgroundColor: "rgba(159,204,0, 0.2)",
            pointBackgroundColor: "rgba(159,204,0, 1)",
            pointHoverBackgroundColor: "rgba(159,204,0, 0.8)",
            borderColor: "rgba(159,204,0, 1)",
            pointBorderColor: '#fff',
            pointHoverBorderColor: "rgba(159,204,0, 1)"
        },"rgba(250,109,33,0.5)","#9a9a9a","rgb(233,177,69)"
    ];

视图：

正如他们的文件中提到的那样，这对我很有效

---

文档

您在哪里设置图表默认值？我们能看到那个代码吗？你不需要看

colors

或

colors

数组。因此，它应该在

watcher函数

之外声明

颜色数组

。不幸的是，这似乎对我不起作用：（它仍然生成随机颜色库。是的，它确实起作用：）我有一些错误的代码。谢谢在我的情况下，我需要设置图表颜色。我使用的是1.1版。1@Evan我也有同样的问题。

colors = ["rgba(159,204,0,0.5)","rgba(250,109,33,0.7)","rgba(154,154,154,0.5)"];

colors = [
        {
            backgroundColor: "rgba(159,204,0, 0.2)",
            pointBackgroundColor: "rgba(159,204,0, 1)",
            pointHoverBackgroundColor: "rgba(159,204,0, 0.8)",
            borderColor: "rgba(159,204,0, 1)",
            pointBorderColor: '#fff',
            pointHoverBorderColor: "rgba(159,204,0, 1)"
        },"rgba(250,109,33,0.5)","#9a9a9a","rgb(233,177,69)"
    ];

      <canvas id="doughnut"
              class="chart chart-doughnut"
              chart-data="$ctrl.piChartData"
              chart-labels="$ctrl.labels"
              chart-options="$ctrl.options"
              chart-colors="$ctrl.colors"
      >
      </canvas>