THANK YOU!! On Tuesday, March 4, 2014 at 11:23:23 PM UTC-3, Daniel LaLiberte wrote: > > Hi Andrew, > > Here is the short and quick answer. > > 1. You should avoid calling google.load() more than one time, and you > should only need to call it one time. > 2. You can call google.setOnLoadCallback() more than once, but the > function you give it, drawChart in your calls, needs to be different for > each chart. > 3. Your drawChart function definitions all are named the same, so each > definition will replace the previous definition. You're lucky to get the > last two charts drawn. > 4. Your div element must have a unique id, one for each chart. You have 3 > chart_divs and 2 donutcharts. > > Fix those problems and you should get some better results. Hope that > helps. > > > On Tue, Mar 4, 2014 at 7:48 PM, Andrew F. <[email protected] > <javascript:>> wrote: > >> I have five pieces of code that I'd like to display on one web page in >> different areas. Unfortunately, only the last two entered will show up at >> any given time. Could anyone help with ideas for a fix? I'd be very >> grateful! >> >> 1) >> >> <script type="text/javascript" src="https://www.google.com/jsapi >> "></script> >> <script type="text/javascript"> >> google.load("visualization", "1", {packages:["corechart"]}); >> google.setOnLoadCallback(drawChart); >> function drawChart() { >> var data = google.visualization.arrayToDataTable([ >> ['Beer', '%'], >> ['J. Marie', 2], >> ['River North White', 2], >> ['Anniversary Ale 2', 3], >> ['Hello, Darkness', 1], >> ['BPR', 2], >> ['Avarice', 1], >> ]); >> >> var options = { >> tooltip: { text:'percentage' }, >> title: 'Beers Sampled', >> pieHole: 0.4, >> }; >> >> var chart = new >> google.visualization.PieChart(document.getElementById('donutchart')); >> chart.draw(data, options); >> } >> </script> >> >> <div id="donutchart" style="width: 408px; height: 306px;"></div> >> >> >> 2) >> >> <script type="text/javascript" src="https://www.google.com/jsapi >> "></script> >> <script type="text/javascript"> >> google.load("visualization", "1", {packages:["corechart"]}); >> google.setOnLoadCallback(drawChart); >> function drawChart() { >> var data = google.visualization.arrayToDataTable([ >> ['Category', 'Average', 'Median', 'Mode'], >> ['Visual Appeal', 3.9, 4, 3.5], >> ['Aromatic Appeal', 3.8, 4, 4.5], >> ['Taste/Flavor', 4.2, 4, 5], >> ['Overall Appeal', 4, 4, 4.5] >> ]); >> >> var options = { >> title: 'Voting Results', >> legend: { position: 'bottom'}, >> vAxis: {title: 'Areas of Interest', titleTextStyle: {color: >> 'black'}} >> }; >> >> var chart = new >> google.visualization.BarChart(document.getElementById('chart_div')); >> chart.draw(data, options); >> } >> </script> >> >> <div id="chart_div" style="width: 408px; height: 306px;"></div> >> >> 3) >> >> <script type="text/javascript" src="https://www.google.com/jsapi >> "></script> >> <script type="text/javascript"> >> google.load("visualization", "1", {packages:["corechart"]}); >> google.setOnLoadCallback(drawChart); >> function drawChart() { >> var data = google.visualization.arrayToDataTable([ >> ['Beer', '%'], >> ['Avalanche Amber Ale', 10] >> ]); >> >> var options = { >> tooltip: { text:'percentage' }, >> title: 'Beers Sampled', >> pieHole: 0.4, >> }; >> >> var chart = new >> google.visualization.PieChart(document.getElementById('donutchart')); >> chart.draw(data, options); >> } >> </script> >> >> <div id="donutchart" style="width: 408px; height: 306px;"></div> >> >> >> 4) >> >> >> <script type="text/javascript" src="https://www.google.com/jsapi >> "></script> >> <script type="text/javascript"> >> google.load("visualization", "1", {packages:["corechart"]}); >> google.setOnLoadCallback(drawChart); >> function drawChart() { >> var data = google.visualization.arrayToDataTable([ >> ['Category', 'Average', 'Median', 'Mode'], >> ['Visual Appeal', 3.8, 4, 4], >> ['Aromatic Appeal', 2.9, 2.5, 2.5], >> ['Taste/Flavor', 3.5, 4, 4], >> ['Overall Appeal', 3.1, 3, 3] >> ]); >> >> var options = { >> title: 'Voting Results', >> legend: { position: 'bottom'}, >> vAxis: {title: 'Areas of Interest', titleTextStyle: {color: >> 'black'}} >> }; >> >> var chart = new >> google.visualization.BarChart(document.getElementById('chart_div')); >> chart.draw(data, options); >> } >> </script> >> >> <div id="chart_div" style="width: 408px; height: 306px;"></div> >> >> >> 5) >> >> <html> >> <head> >> <script type="text/javascript" src="https://www.google.com/jsapi >> "></script> >> <script type="text/javascript"> >> google.load("visualization", "1", {packages:["corechart"]}); >> google.setOnLoadCallback(drawChart); >> function drawChart() { >> var data = google.visualization.arrayToDataTable([ >> ['Category', 'Visual', 'Aromatic', 'Flavor/Taste', 'Overall', >> { role: 'annotation' } ], >> ['River North', 3.9, 3.8, 4.2, 4, ''], >> ['Breckenridge', 3.8, 2.9, 3.5, 3.1, ''], >> >> ]); >> >> var options = { >> title: 'Contest Results', >> width: 408, >> height: 306, >> legend: { position: 'top', maxLines: 3 }, >> bar: { groupWidth: '75%' }, >> isStacked: true, >> }; >> >> var chart = new >> google.visualization.BarChart(document.getElementById('chart_div')); >> chart.draw(data, options); >> } >> </script> >> </head> >> <body> >> <div id="chart_div" style="width: 408px; height: 306px;"></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] >> <javascript:>. >> To post to this group, send email to [email protected] >> <javascript:>. >> Visit this group at >> http://groups.google.com/group/google-visualization-api. >> For more options, visit https://groups.google.com/groups/opt_out. >> > > > > -- > Daniel LaLiberte <https://plus.google.com/100631381223468223275?prsrc=2> > - 978-394-1058 > [email protected] <javascript:> 5CC, Cambridge MA > [email protected] <javascript:> 9 Juniper Ridge Road, Acton MA >
-- 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/eb4744a6-3b7f-49be-b987-1fbfcda2baaf%40googlegroups.com. For more options, visit https://groups.google.com/d/optout.
