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.
