chartjs 2+如何指定條形圖着色

Question

我嘗試使用以下庫雖然我沒有得到這個工作對我的色彩柱狀圖和顏色總是隨機的。數據正常工作。我已經包含了下面加載的版本和順序。希望這可以幫助。

任何幫助非常感謝。

非常感謝，

代碼片斷

<script src="js/chartjs/Chart.js" defer></script> 
<script src="js/angular-chart/angular-chart.min.js" defer></script> 

庫版本

• AngularJS V1.5.0-rc.2
• chart.js之版本：2.3。 0
• 角chart.js之版本：1.1.1

HTML標記

<canvas id="line" class="chart chart-bar" chart-color="backgroundColour: 'Red'" chart-data="vm.chartData.data" chart-labels="vm.chartData.legends" chart-series="vm.series" chart-options="vm.options" chart-dataset-override="vm.datasetOverride" chart-click="vm.onClick"></canvas> 

最終溶液注意到

最終工作溶液使用角設置的顏色在控制器1.5.8

Answer 1

您可以在控制器中指定的顏色：

... 
$scope.vm.colors = [ '#f7464a', '#949FB1']; 
... 

，後來在圖表中使用：

<canvas id="line" class="chart chart-bar" chart-colors="vm.colors" chart-data="vm.chartData.data" chart-labels="vm.chartData.legends" chart-series="vm.series" chart-options="vm.options" chart-dataset-override="vm.datasetOverride" chart-click="vm.onClick"></canvas> 

小demo

UPDATE：

設置全局顏色，你可以設置Chart.defaults.global.colors或使用ChartJsProvider和設置顏色在.config()如下（見documentation）：

ChartJsProvider.setOptions({ colors : [ '#803690', '#00ADF9' ] }); 

現在，最後一個選項我無法工作，它更新了一些不同的圖表對象，它與實際使用的圖表沒有任何關係。但Chart.defaults.global.colors方法作品，請參閱更新demo。