Màu biểu đồ thanh xếp chồng của Google

Question

Làm cách nào để thay đổi màu của cột trong biểu đồ thanh xếp chồng? Nếu tôi chỉ định thuộc tính màu sắc trong hàm MakeBarChart, nó chỉ lấy tham số đầu tiên. Và làm cho các cột khác trở thành phiên bản nhẹ hơn của màu đó. Đây là những gì nó trông giống như;

Và đây là mã;

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

Làm thế nào tôi có thể làm cho cột tất cả đều có màu sắc riêng biệt của riêng mình.

Answer 1

Vấn đề là với giá trị màu sắc của bạn, chúng không ở định dạng RGB chính xác.

giá trị đúng sẽ là:
một trong hai giá trị hex RGB (với giá trị 2 chữ số hex cho mỗi màu) như '# 00CC88' hoặc
một trong hai giá trị hex RGB (với giá trị hex 1 chữ số cho mỗi màu) như '# 0C8' hoặc
hoặc tên màu hợp lệ.

nên thay vì

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

thử

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

hoặc

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

hoặc bạn cũng có thể làm

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

Xem ví dụ về jsfiddle tại đây: https://jsfiddle.net/rdtome/2vjLc0q0/