谷歌堆积条形图颜色

Question

如何更改堆积条形图中列的颜色？ 如果我在MakeBarChart函数中指定colors属性，它只接受第一个参数。 并使其他列成为该颜色的较轻版本。 这就是它的样子;

这就是代码;

 function MakeBarChart(tmpData) { var barArray = []; barArray.push(['', 'Open', 'Wachten', 'Opgelost']); for (key in tmpData) { if (tmpData.hasOwnProperty(key)) { barArray.push(['Week' + key, tmpData[key]['active'], tmpData[key]['waiting'], tmpData[key]['closed']]) } } var data = google.visualization.arrayToDataTable( barArray ); var options = { chart: { title: 'Incidenten per week', subtitle: '', 'width':450, 'height':300, }, bars: 'vertical', // Required for Material Bar Charts. 'backgroundColor':{ fill:'transparent' }, isStacked: true, colors:['#000','#1111','#55555'] }; var chart = new google.charts.Bar(document.getElementById('barchart_material')); chart.draw(data, google.charts.Bar.convertOptions(options)); } 

如何使列都有自己独立的颜色。

Answer 1

问题在于您的颜色值，它们的格式不正确。

正确的值将是：
RGB十六进制值（每种颜色有2位十六进制值），如'＃00CC88'或
RGB十六进制值（每种颜色带有1位十六进制值），如“＃0C8”或
或有效的颜色名称。

而不是

colors:['#000','#1111','#55555'] // wrong values (2nd and 3rd values) 

尝试

colors:['#11AA77','#999922','#550077']

要么

colors:['#1A7','#992','#507']

或者你也可以

colors:['red','darkgreen','yellow']

在这里查看一个jsfiddle示例： https ：//jsfiddle.net/rdtome/2vjLc0q0/