http://jsfiddle.net/gcjavp1e/1/ <http://jsfiddle.net/gcjavp1e/1/>Working very well. Cheers again!
On Friday, 29 August 2014 09:16:06 UTC+10, [email protected] wrote: > > Thank you so much for that Andrew! Big Help! :) > > On Friday, 29 August 2014 08:26:58 UTC+10, Andrew Gallant wrote: >> >> Here's one way you could do it: http://jsfiddle.net/asgallant/5haLzo0t/. >> Look that over, and feel free to ask any questions you may have about it. >> >> On Wednesday, August 27, 2014 9:07:24 PM UTC-4, [email protected] wrote: >>> >>> Hi Andrew, >>> >>> Thanks for taking a look. I'm sure this is totally totally >>> embarrassingly wrong. >>> >>> <script type="text/javascript" src="https://www.google.com/jsapi"; >>> ></script> >>> <script type="text/javascript"> >>> >>> >>> google.load('visualization', '1', {packages: ['corechart']}); >>> >>> >>> google.setOnLoadCallback(drawExample2); >>> >>> >>> function drawExample2() { >>> // Some raw data (not necessarily accurate) >>> var rowData1 = [['Month', 'Bolivia', 'Ecuador', 'Madagascar', 'Papua >>> Guinea', >>> 'Rwanda'], >>> ['2004/05', 165, 938, 522, 998, 450], >>> ['2005/06', 135, 1120, 599, 1268, 288], >>> ['2006/07', 157, 1167, 587, 807, 397], >>> ['2007/08', 139, 1110, 615, 968, 215], >>> ['2008/09', 136, 691, 629, 1026, 366]]; >>> var rowData2 = [['Month', 'Bolivia', 'Ecuador', 'Madagascar', 'Papua >>> Guinea', >>> 'Rwanda'], >>> ['2004/05', 122, 638, 722, 998, 450], >>> ['2005/06', 100, 1120, 899, 1268, 288], >>> ['2006/07', 183, 167, 487, 207, 397], >>> ['2007/08', 200, 510, 315, 1068, 215], >>> ['2008/09', 123, 491, 829, 826, 366]]; >>> var rowData3 = [['Month', 'Bolivia', 'Ecuador', 'Madagascar', 'Papua >>> Guinea', >>> 'Rwanda'], >>> ['2004/05', 122, 638, 722, 998, 450], >>> ['2005/06', 100, 1120, 899, 1268, 288], >>> ['2006/07', 183, 167, 487, 207, 397], >>> ['2007/08', 200, 510, 315, 1068, 215], >>> ['2008/09', 123, 491, 829, 826, 366]]; >>> >>> >>> // Create and populate the data tables. >>> var data = []; >>> data[0] = google.visualization.arrayToDataTable(rowData1); >>> data[1] = google.visualization.arrayToDataTable(rowData2); >>> data[2] = google.visualization.arrayToDataTable(rowData3); >>> >>> >>> var options = { >>> width: 400, >>> height: 240, >>> vAxis: {title: "Cups"}, >>> hAxis: {title: "Month"}, >>> seriesType: "bars", >>> series: {5: {type: "line"}}, >>> animation:{ >>> duration: 1000, >>> easing: 'out' >>> } >>> }; >>> var current = 0; >>> // Create and draw the visualization. >>> var chart = new google.visualization.ColumnChart(document. >>> getElementById('example2-visualization')); >>> var button = document.getElementById('example2-b1'); >>> function drawChart() { >>> // Disabling the button while the chart is drawing. >>> button.disabled = true; >>> google.visualization.events.addListener(chart, 'ready', >>> function() { >>> button.disabled = false; >>> button.value = 'Switch to ' + (current ? 'Tea' : 'Coffee' : >>> 'Water'); >>> }); >>> options['title'] = 'Monthly ' + (current ? 'Coffee' : 'Tea' : >>> 'Water') + ' Production by Country'; >>> >>> >>> chart.draw(data[current], options); >>> } >>> drawChart(); >>> >>> >>> button.onclick = function() { >>> current = 1 - current; >>> drawChart(); >>> } >>> } >>> >>> >>> </script> >>> >>> >>> <form> >>> <input id="example2-b1" type="button" value="Switch to Tea" /> >>> </form> >>> <div id="example2-visualization"> </div> >>> >>> >>> >>> On Thursday, 28 August 2014 10:54:49 UTC+10, Andrew Gallant wrote: >>>> >>>> If you post what you've tried so far, I'll help you through the changes >>>> you need to make it work. >>>> >>>> On Wednesday, August 27, 2014 8:29:04 PM UTC-4, [email protected] >>>> wrote: >>>>> >>>>> Hi all, >>>>> >>>>> Trying to get >>>>> >>>>> The Tea/Coffee example on >>>>> https://google-developers.appspot.com/chart/interactive/docs/animation >>>>> on a normal column chart (no average line). >>>>> >>>>> https://google-developers.appspot.com/chart/interactive/docs/gallery/columnchart >>>>> >>>>> Also trying to get the button to be able to cycle through 3 sets of >>>>> data. So Tea - Coffee - Water. >>>>> >>>>> Not having much luck, anyone got any tips? >>>>> >>>>> >>>>> -- 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 http://groups.google.com/group/google-visualization-api. For more options, visit https://groups.google.com/d/optout.
