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更改图表背景和突出显示颜色

回答

相关问题