How to change colours for Angular-Chart.js

前端 未结 7 1636
误落风尘
误落风尘 2020-12-03 01:12

I use Angular-Chart.js (the AngularJS Chart.js version) to create a bar chart. The Chart is working with the options except for the colours.

Even if I set them it is

7条回答
  •  暗喜
    暗喜 (楼主)
    2020-12-03 01:46

    With the latest version $scope.colors does not seem to work. You need to use chart-dataset-override="colors"

    DEMO

    angular.module("app", ["chart.js"]).controller("DoughnutCtrl", function ($scope) {
      $scope.results = {'1': 0, '2': 0, '3': 0, '4': 0, '5': 0, '6': 0, '7': 0, '8': 0, '9': 0, '10': 0};
      $scope.labels = ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10'];
      
      $scope.data = [
        [1, 3, 5, 8, 9, 10, 11, 12, 33, 5]
      ];
      $scope.colors = [{ 
        fillColor: 'rgba(59, 89, 152,0.2)',
        strokeColor: 'rgba(59, 89, 152,1)',
        pointColor: 'rgba(59, 89, 152,1)',
        pointStrokeColor: '#fff',
        pointHighlightFill: '#fff',
        pointHighlightStroke: 'rgba(59, 89, 152,0.8)'
      }];
    });
    
    
    
      
      Multi Slot Transclude
      
      
      
    
    
      
          
    
    

提交回复
热议问题