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 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.
