score:1

Accepted answer

your js:

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

your directive markup:

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

the docs say you can override default colors by setting the array :

chart.defaults.global.colours

score:0

for version 1.x there are two ways either object instances or simple rgba values as string:

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)"
    ];

view:

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

that's worked for me as mentioned in their docs.

docs link


Related Query

More Query from same tag