is it possible to have multiple google charts in one page?

159 views
Skip to first unread message

Bo

unread,
Jul 15, 2011, 1:22:26 PM7/15/11
to Google Visualization API
I am using Google visualization api.
Following is my sample code. Either of the two charts can be shown if
it is the only one to be drawn. But I can not get both working. Thanks
for your advice.

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=UTF-8"></meta>
<title>Home Page</title>
<!--Load the AJAX API-->
<script type="text/javascript" src="http://www.google.com/
jsapi"></script>
<script type="text/javascript">
//Load the Visualization API and the ready-made Google
table visualization
google.load('visualization', '1', {'packages':
['corechart']});
</script>

<script type='text/javascript'>

function drawA() {
// Define the chart using setters:
var wrap = new
google.visualization.ChartWrapper();
wrap.setChartType('ColumnChart');
wrap.setDataSourceUrl('dataurl');
wrap.setContainerId('checkin-column');
wrap.setOptions({'title':'Daily Check-in Numbers',
'width':500,'height':400});
wrap.draw();
wrap.getChart();
}

function drawB() {
// Define the chart using setters:
var wrap = new
google.visualization.ChartWrapper();
wrap.setChartType('ColumnChart');
wrap.setDataSourceUrl('dataurl2');
wrap.setContainerId('redemption-table');
wrap.setOptions({'title':'Redemption History',
'width':500,'height':400});
wrap.draw();
}



function drawVisualization() {
drawA();
drawB();

}


google.setOnLoadCallback(drawVisualization);
</script>
</head>
<body>



<div id="checkin-column"/>
<p/>
<div id="redemption-table"/>

</body>
</html>

asgallant

unread,
Jul 15, 2011, 2:24:46 PM7/15/11
to google-visua...@googlegroups.com
What happens if you merge the two functions, renaming the wrappers so they are different (ie, "wrap1" and "wrap2")?

Jinji

unread,
Jul 18, 2011, 10:02:24 AM7/18/11
to google-visua...@googlegroups.com
Can you post a full working example so we could test?

On Fri, Jul 15, 2011 at 9:24 PM, asgallant <drew_g...@abtassoc.com> wrote:
What happens if you merge the two functions, renaming the wrappers so they are different (ie, "wrap1" and "wrap2")?

--
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To view this discussion on the web visit https://groups.google.com/d/msg/google-visualization-api/-/npqB91_YYewJ.

To post to this group, send email to google-visua...@googlegroups.com.
To unsubscribe from this group, send email to google-visualizati...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-visualization-api?hl=en.

Reply all
Reply to author
Forward
0 new messages