Google Stacked Bar Chart color

Question

Как я могу изменить цвет столбца в штабелированной гистограмме? Если я укажу атрибут цветов в моей функции MakeBarChart, он принимает только первый параметр. И делает другие столбцы более легкой версией этого цвета. Вот как это выглядит;

И это код;

function MakeBarChart(tmpData) 
 
{ \t 
 
\t var barArray = []; 
 
\t barArray.push(['', 'Open', 'Wachten', 'Opgelost']); 
 
\t for (key in tmpData) { 
 
\t \t if (tmpData.hasOwnProperty(key)) { 
 
\t \t \t barArray.push(['Week' + key, tmpData[key]['active'], tmpData[key]['waiting'], tmpData[key]['closed']]) 
 
\t \t } 
 
\t } 
 

 
\t var data = google.visualization.arrayToDataTable(
 
\t \t barArray 
 
\t); 
 
\t 
 
\t var options = { 
 
\t \t chart: { 
 
\t \t title: 'Incidenten per week', 
 
\t \t subtitle: '', 
 
\t  'width':450, 
 
\t  'height':300, 
 
    }, 
 
    bars: 'vertical', // Required for Material Bar Charts. 
 
\t \t 'backgroundColor':{ fill:'transparent' }, 
 
\t \t isStacked: true, 
 
\t \t colors:['#000','#1111','#55555'] 
 
\t }; 
 

 
\t var chart = new google.charts.Bar(document.getElementById('barchart_material')); 
 
\t chart.draw(data, google.charts.Bar.convertOptions(options)); 
 
}

Как я могу сделать столбец все имеют свой собственный отдельный цвет.

Answer 1

Проблема с вашими значениями цветов, они не в правильном формате RGB.

Правильные значения будут:
либо шестнадцатиричное значение 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/