Struggling to change colors in column chart

27 views

Skip to first unread message

Zavman

unread,

Sep 11, 2018, 8:56:47 AM9/11/18

to Google Visualization API

Hello, Hoping someone here can please assist me; I am really struggling to change colors of bars in this code from the Google default colors. I've read the Google Charts Instructions, but it doesn't seem to fit my example below or I am just not clear on implementing. Please help me. Code below has no color changes made to it. Could someone please give me an example of where I would modify this code to change color of bars?

Thank you!

Zav

<html>

<head>

google.charts.load('current', {'packages':['bar']});

google.charts.setOnLoadCallback(drawChart);

function drawChart() {

var data = google.visualization.arrayToDataTable([

['Sales Rep', 'Last Year', 'This Year', 'Current Goal'],

['ALI', 236846, 394469, 29090.9090909090909091],

['BRANDON', 372545, 398229, 49090.9090909090909091],

['Charlie', 108150, 106701, 14545.4545454545454545],

['Dan', 395879, 254291, 40909.0909090909090909],

['Jake', 234991, 336385, 36363.6363636363636364],

['JJ', 142626, 88781, 49090.9090909090909091],

['JOE', 82765, 96633, 12727.2727272727272727],

['Lauren', 259511, 182041, 28181.8181818181818182],

['Ziggy', 148210, 126760, 18181.8181818181818182],

]);

var options = {

chart: {

title: 'Total Sales',

subtitle: 'By Sales Rep'

bars: 'horizontal'

};

var chart = new google.charts.Bar(document.getElementById('barchart_material'));

chart.draw(data, options);

}

</script>

</head>

<body>

</body>

</html>

Sagar Varma

unread,

Sep 12, 2018, 2:18:19 AM9/12/18

to Google Visualization API

Hi,

Can u try below Colors options to give custom colors to the bars.

var options = {

chart: {

title: 'Total Sales',

subtitle: 'By Sales Rep'

bars: 'horizontal',

colors:['#F3BF31','#31B2F3','orange'],

};

Reply all

Reply to author

Forward

0 new messages