2015-05-18 15 views
6

मैं स्टैक्ड बार चार्ट में कॉलम का रंग कैसे बदल सकता हूं? अगर मैं अपने MakeBarChart फ़ंक्शन में रंग विशेषता निर्दिष्ट करता हूं, तो यह केवल पहला पैरामीटर लेता है। और अन्य स्तंभों को उस रंग का हल्का संस्करण बनाता है। यह है जो ऐसा लग रहा है;Google स्टैक्ड बार चार्ट रंग

image

और यह कोड है,

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

मैं स्तंभ सब अपनी अलग रंग है कैसे कर सकते हैं।

उत्तर

3

समस्या आपके रंग मानों के साथ है, वे सही आरजीबी प्रारूप में नहीं हैं।

सही मान होंगे:
या तो आरजीबी हेक्स मान '# 00CC88' की तरह या
या तो आरजीबी हेक्स मान (रंग प्रति 1 अंकीय हेक्स मान के साथ) (रंग प्रति 2 अंकीय हेक्स मान के साथ) '# 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/

+0

धन्यवाद! मैंने इसे पहले से ही कॉलम ग्राफ़ पर स्विच कर दिया है, लेकिन यह जानना अच्छा है कि यह एक बार के रूप में भी संभव है। – joost

संबंधित मुद्दे