谷歌堆叠条形图颜色

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));
}

如何使每个列都有自己独立的颜色？

- joost

Answer 1

问题出在您的颜色值上，它们没有正确的RGB格式。

正确的值应该是：
要么是带有2个十六进制值的RGB十六进制值，如“#00CC88”，或
要么是带有1个十六进制值的RGB十六进制值，如“#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/

- rtome

---

谢谢！我已经将它切换为柱状图了，但知道作为条形图也是可能的也很不错。 - joost