angular-chartJs更改圖表背景和突出顯示顏色

此問題是關於angular-chartjs 1.1.1。angular-chartJs更改圖表背景和突出顯示顏色

首先，我想禁用圖表上的懸停顏色。我已經設置下列選項設置爲false：

tooltips: { 
    enabled: false 
}, 
hover: { 
    enabled: false 
},

這不工作，所以我決定改變我的圓環圖的顏色，包括highlightColor。要設置顏色，我在畫布上添加了指令chart-colors="colors"。我的範圍我增加了以下內容：

$scope.colors = [{ 
    fill: true, 
    backgroundColor: ["#FF6384","#36A2EB"] 
}]

我也試過如下：

$scope.colors = [{ 
    fill: true, 
    backgroundColor: "#FF6384" 
},{ 
    fill: true, 
    backgroundColor: "#36A2EB" 
}]

兩個代碼片段不工作。他們只是把我的圖表部分變成灰色，但不是指定的顏色。只有下面的代碼改變了我的圖表顏色：

$scope.colors = ["#FF6384","#36A2EB"]

這隻會改變backgroundColor，但我想改變highlightColor太多，所以這種解決方案對我來說沒有任何選項。任何人有一個想法如何設置圖表的backgroundColor和hightlightColor？

來源

2017-02-21 ChampS

我找到了解決辦法。看來我必須使用的正是這種寫法：

colors: [{ 
    backgroundColor: '#FF6384', 
    pointBackgroundColor: '#FF6384' 
}, { 
    backgroundColor: '#36A2EB', 
    pointBackgroundColor: '#36A2EB' 
}],

所以pointBackgroundColor會更改圖表顏色不是的backgroundColor本身。 backgroundColor對於懸停效果是必需的，所以pointedBackground將不可見並且背景將顯示在前面。

感謝@Dominik Heim，您的鏈接是一個很大的幫助！

來源

2017-02-21 16:41:27 ChampS

你能提供完整的代碼嗎？對於合格的答案會更容易嗎？在此基礎上https://stackoverflow.com/a/28654829/6629704我以爲

，你可能要兩個顏色添加到陣列，因爲也許數組的第3和第4位會定義高亮色彩

來源

2017-02-21 15:51:55

angular-chartJs更改圖表背景和突出顯示顏色

回答

相關問題