Sometimes it is helpful to display two sets of data in animated sequence to illustrate the dynamics of the change in data values. The transition animation option in the Visualization API is intended for that purpose.
Controls for triggering a transition animation utilize standard HTML methods. Common elements, such as a simple button-click using the JavaScript onclick()
method, can be used to initiate animation sequences. The following diagram is of the two states of a visualization. In one state, the total population of Chicago taken in the 2000 Census is shown. In the other state, the 2010 Chicago population is visualized. To toggle between the two bar graphs, the user is provided with a button in the upper-right hand corner of the chart. Pressing the button will toggle the visualization between the 2000 and 2010 population chart. Once the button is pressed, the Visualization API will smoothly transition the bar graph to the selected data representation.
The code for...