javascript - Google Chart tools Visualizations - Implementing more than one on a page -
i'm trying use google chart tools visualize data on site. thing is, can't more 1 load...
you can find docs here: http://code.google.com/apis/visualization/documentation/using_overview.html#load_your_libraries
and here code far:
<script type='text/javascript' src='https://www.google.com/jsapi'></script> <script type='text/javascript'> google.load('visualization', '1', {'packages':['annotatedtimeline']}); google.setonloadcallback(drawall); function drawall() { drawsales(); drawregistration(); } function drawsales() { // sales graph var data = new google.visualization.datatable(); data.addcolumn('date', 'date'); data.addcolumn('number', 'sales'); data.addrows([ [new date(2011, 04 ,30), 401.34], [new date(2011, 04 ,22), 180.00], [new date(2011, 04 ,18), 180.00] ]); var chart = new google.visualization.annotatedtimeline(document.getelementbyid('chart_div_sales')); chart.draw(data, {}); } function drawregistration() { // regisrtration graph var data2 = new google.visualization.datatable(); data.addcolumn('date', 'date'); data.addcolumn('number', 'registration'); data.addrows([ [new date(2, 0 ,1), 1], [new date(2, 0 ,1), 1] ]); var chart2 = new google.visualization.annotatedtimeline(document.getelementbyid('chart_div_userregistration')); chart2.draw(data2, {}); } </script> <style> .charts{ float: left; width:510px; padding:10px; } </style> <h1>stats</h1> <div class="charts"> <h1>overall sales</h1> <div id='chart_div_sales' style='width: 500px; height: 300px;'></div> </div> <div class="charts"> <h1>user registration</h1> <div id='chart_div_userregistration' style='width: 500px; height: 300px;'></div> </div>
the first 1 loading fine, not second one. doing wrong??
thanks help.
replace data
data2
in drawregistration
, fine. also, have @ firebug tool, catch kind of errors quite painlessly.
Comments
Post a Comment