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

Question

我正在使用 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);

});

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

Answer 1

你的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>

文档说你可以通过设置数组来覆盖默认颜色:

Chart.defaults.global.colours