JavaScript Chart Animation

In this blog entry we look at the ShieldUI Chart animation options.

The Shield UI Chart offers animations, which improve the visual effects and impact of visualization applications.

There are two locations for specifying animations:
1. The chart section:

1 2 3

applyAnimation: {     duration: 1300 }

This setting allows you to specify the duration for the animation, in milliseconds. This is applicable for all animations, such as axis rendering, but not series drawing. The animation for the series is set as shown in the next section.

2. Animation can be applied for individual chart types through the seriesSettings tag, as shown below:

1 2 3 4 5 6 7

seriesSettings: {     area: {         applyAnimation: {             duration: 2000                    }     } }

This setting affects the rendering speed of each series of such type.
This setting is demonstrated in the following example.