How to use Animations

Guide For using Animations in Charts

Usage

Animations have been implemented for bar, line and area charts. These animations include animation from zero on initialization and rendering, as well as transitions outlining changes in the data property that are similar enough to what the previous data was before, as well as opacity animations.

Animations are declared on a chart-by-chart basis with the animations prop. Animations are enabled by default. In order for transitions between data to be animated, the two datasets **must ** be fully equal in terms of their dimension scale (this is usually the x-axis, but can be explicitly defined as a chart prop).

Opacity animations are implemented by default. If hover properties are defined, initially hovering over a section of the graph will cause the others' opacity to fade out. Hovering over sections within the graph will not cause the animation to retrigger, but moving outside of the hover area and back in will reanimate opacity. This is also enabled for legend configurations with hover enabled, as well.