In that case, it looks like you can ignore the second half of my reply. On Wednesday, July 11, 2012 9:30:04 AM UTC-4, Yuval Ronen wrote: > > I didn't look at the code, but in general, the 'animation' option refers > to animation between the previous draw() call and this draw() call. > > On Mon, Jul 9, 2012 at 6:41 PM, asgallant <[email protected]>wrote: > >> Skimming over your code, it looks like you should just be able to set >> options.animation to whatever you want prior to redrawing the chart. >> >> It is possible, however, that the relevant animation setting is the one >> which was previously used to draw the chart, not the one passed with the >> current draw call. I have not tested this, so I don't know which is >> correct, but if it turns out this way, the solution should be to change >> only the animation option, redraw the chart, set the rest of the >> options/data and redraw again. >> >> On Friday, July 6, 2012 11:56:53 AM UTC-4, nebands wrote: >>> >>> Is it possible to do this? I want to be able to change values and change >>> the view window on the same chart with different buttons. The scripts I am >>> using for each function look like this: >>> >>> To change Data Values: >>> >>> <script type="text/javascript"> >>> >>> google.load('visualization', '1.1', {packages: ['corechart']}); >>> >>> google.setOnLoadCallback(**drawChart1); >>> >>> function drawChart1() { >>> >>> var rowData3 = [['Month', 'Offering1', 'Offering2', 'Offering3'], >>> ['Oct 11', 0, 1, 0], >>> ['Nov 11', 1, 2, 1], >>> ['Dec 11', 0, 0, 0], >>> ['Jan 12', 0, 1, 0], >>> ['Feb 12', 0, 1, 1], >>> ['Mar 12', 0, 5, 0], >>> ['Apr 12', 4, 1, 0], >>> ['May 12', 3, 0, 1] ]; >>> >>> >>> var rowData4 = [['Month', 'Dollars'], >>> ['Oct 11', 10000], >>> ['Nov 11', 5000], >>> ['Dec 11', 600], >>> ['Jan 12', 7000], >>> ['Feb 12', 1000], >>> ['Mar 12', 0], >>> ['Apr 12', 8000], >>> ['May 12', 15000] ]; >>> >>> // Create and populate the data tables. >>> var data = []; >>> data[0] = google.visualization.**arrayToDataTable(rowData3); >>> data[1] = google.visualization.**arrayToDataTable(rowData4); >>> >>> var options = { >>> width: 600, >>> height: 400, >>> vAxis: {title: "Contracts"}, >>> hAxis: {title: "Month", slantedText:true, slantedTextAngle:45 }, >>> series: [{color:'#4682B4', visibleInLegend: true}, >>> {color:'#C0C0C0', visibleInLegend:true},{color:'**#2A4C6A', >>> visibleInLegend:true}], >>> animation:{ >>> duration: 1000, >>> easing: 'out' >>> } >>> }; >>> var current = 0; >>> // Create and draw the visualization. >>> var chart = new google.visualization.**ColumnChart(document.** >>> getElementById('Chart1')); >>> var button = document.getElementById('**Chart1Button'); >>> 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 = 'Change to Value'; >>> }); >>> options['title'] = 'Monthly ' + (current ? 'Dollars' : ' Number') >>> ; >>> >>> chart.draw(data[current], options); >>> } >>> drawChart(); >>> >>> button.onclick = function() { >>> current = 1 - current; >>> drawChart(); >>> } >>> } >>> >>> </script> >>> >>> To Change View Window: >>> <script type='text/javascript'> >>> google.load('visualization', '1.1', {packages: ['corechart']}); >>> google.setOnLoadCallback(**drawExample5); >>> >>> function drawExample5() { >>> var options = { >>> width: 600, >>> height: 400, >>> animation: { >>> duration: 1000, >>> easing: 'in'}, >>> title: 'Monthly Revenue', >>> vAxis: {title: "$ in 000s"}, >>> series: [{color:'#4682B4', visibleInLegend: true}, >>> {color:'#C0C0C0', visibleInLegend:true}], >>> hAxis: {title: 'Month', slantedText:true, slantedTextAngle:45, >>> viewWindow:{min:12, max:20}}}; >>> >>> var chart = new google.visualization.**ColumnChart( >>> document.getElementById('**Chart')); >>> >>> var data = google.visualization.**arrayToDataTable([ >>> ['Month', 'Revenue', 'Budgeted Revenue'], >>> >>> [DATA] >>> >>> >>> var MAX = 20; >>> for (var i = 0; i < MAX; ++i) { >>> >>> var changeZoomButton = document.getElementById('**Chart'); >>> function drawChart() { >>> // Disabling the button while the chart is drawing. >>> >>> changeZoomButton.disabled = true; >>> google.visualization.events.**addListener(chart, 'ready', >>> function() { >>> >>> changeZoomButton.disabled = false; >>> }); >>> chart.draw(data, options); >>> }} >>> >>> >>> var zoomed = false; >>> changeZoomButton.onclick = function() { >>> if (zoomed) { >>> options.hAxis.viewWindow.min = 12; >>> options.hAxis.viewWindow.max = 20; >>> } else { >>> options.hAxis.viewWindow.min = 0; >>> options.hAxis.viewWindow.max = 20; >>> } >>> zoomed = !zoomed; >>> drawChart(); >>> } >>> drawChart(); >>> } >>> </script> >>> >>> >>> -- >> 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/-/EQKE8jHjbR8J. >> To post to this group, send email to >> [email protected]. >> To unsubscribe from this group, send email to >> [email protected]. >> For more options, visit this group at >> http://groups.google.com/group/google-visualization-api?hl=en. >> > >
-- 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/-/27IW6Es3TRMJ. To post to this group, send email to [email protected]. To unsubscribe from this group, send email to [email protected]. For more options, visit this group at http://groups.google.com/group/google-visualization-api?hl=en.
