Hi all, I'm new at Google APIs and JavaScript, I would like to know if its 
possible to change the type of chart from bar to line or viceversa on a 
particular series of data by just clicking the Legend Series. Here is a 
simple chart code I copied and managed to get it work for my project, so 
far I got to where clicking the Legend shows the value I clicked. If 
possible can you direct me to how??

Thanks so much in advance.

Fernando Yanes

<!DOCTYPE html>

<html>

<head>

<script type="text/javascript" src=
"https://www.gstatic.com/charts/loader.js";></script>

<script type="text/javascript">

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

google.charts.setOnLoadCallback(drawVisualization);


function drawVisualization() {

        var data = google.visualization.arrayToDataTable([

['Periodo','A','B','C','D','E','F','G','H','I','J',],

['x1', 120,938,522,100,450,614.6,300,100,450,900],

['x2',  135,112,599,1268,288, 682,125,390,564,123 ],

['x3',  157,1167,587,807,397,623,54,255,126,300 ],

['x4',  139,1110,615,968,215,609.4,63,162,987,1002 ],

['x5',  139,1110,615,968,215,609.4,63,162,987,1002 ],

['x6',  139,1110,615,968,215,609.4,63,162,987,1002 ]

]);


var options = {

title : 'My Title',

vAxis: {title: 'Y-Axis'},

hAxis: {title: 'X-Axis'},

width: '0px',

legend: {position:'top'},

seriesType: 'bars',

series: {

0: {type: 'bar', color: '#F5A623'},

1: {type: 'bar', color: '#AC2424'},

2: {type: 'bar', color: '#F16806'},

3: {type: 'bar', color: '#9013FE'},

4: {type: 'bar', color: '#5B9BE5'},

5: {type: 'bar', color: '#7ED321'},

6: {type: 'bar', color: '#2AB797'},

7: {type: 'bar', color: '#F523CE'},

8: {type: 'bar', color: '#4A4A4A'},

9: {type: 'bar', color: '#8B572A'},

}

};


var chart = new 
google.visualization.ComboChart(document.getElementById('chart_div'));

chart.draw(data, options);


google.visualization.events.addListener(chart, 'click', function(event) {

var legendClicked = event.targetID;

alert(legendClicked + ' was clicked') 

});

}


</script>

</head>

<body>

<div id="chart_div" style="width: 1200px; height: 500px;"></div>

</body>

</html>

-- 
You received this message because you are subscribed to the Google Groups 
"Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to [email protected].
To post to this group, send email to [email protected].
Visit this group at https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/google-visualization-api/d4010b6f-8930-40db-94ad-33e0684453eb%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Reply via email to