0
140
ViewsGoogle charts javascript : Stacked column, transparent color
Here is the stacked chart I have, I would like to be able to change the color of the session (here red) in transparent. Would you have an idea ? thanks.
And here is my code :
var data = google.visualization.arrayToDataTable(my_data);
var options = {
title: 'S-Score',
colors: ['red', '#70a1c0'],
width: 700,
height: 400,
chartArea: { width: "60%" },
fontSize: 14,
legend: { position: 'right' },
bar: { groupWidth: '75%' },
isStacked: true
};
var chart = new google.visualization.ColumnChart(document.getElementById('E_chart'));
·
Juan Pablo Isaza
1 answers
Answer question0
you can use 'transparent' as the color name, here...
colors: ['transparent', '#70a1c0'],
see following working snippet...
google.charts.load('current', {
packages: ['corechart']
}).then(function () {
var data = google.visualization.arrayToDataTable([
['x', 'white', 'colored'],
['E', 0, 4],
['S', 4, 3],
['G', 7, 3],
['E', 10, 6],
['Score', 0, 16]
]);
var options = {
title: 'S-Score',
colors: ['transparent', '#70a1c0'],
width: 700,
height: 400,
chartArea: { width: "60%" },
fontSize: 14,
legend: { position: 'right' },
bar: { groupWidth: '75%' },
isStacked: true
};
var chart = new google.visualization.ColumnChart(document.getElementById('E_chart'));
chart.draw(data, options);
});<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="E_chart"></div>
·
Juan Pablo Isaza
Report
Answer question