samedi 28 février 2015

Google charts changing of a selected bar


I need to change the color of a selected bar after the chart has been loaded. The selected bar changes each time so I can't just specify in the style.



$(function() {
google.load('visualization', '1', { 'callback': drawChart, 'packages':['corechart'] });

function drawChart() {
var data = google.visualization.arrayToDataTable([
["Element", "Density", { role: "style" } ],
["Copper", 8.94, "#b87333"],
["Silver", 10.49, "silver"],
["Gold", 19.30, "gold"],
["Platinum", 21.45, "color: #e5e4e2"]
]);

var view = new google.visualization.DataView(data);
view.setColumns([0, 1,
{ calc: "stringify",
sourceColumn: 1,
type: "string",
role: "annotation" },
2]);

var options = {
title: "Density of Precious Metals, in g/cm^3",
width: 600,
height: 400,
bar: {groupWidth: "95%"},
legend: { position: "none" },
};
var chart = new google.visualization.ColumnChart(document.getElementById("columnchart_values"));
chart.draw(view, options);


}


})


I understand I can select a bar using:


var selectedItem = chart.getSelection()[0];


How would I change the color of "selectedItem" from here. Picture of chart if you are curious





Aucun commentaire:

Enregistrer un commentaire