-
Book Overview & Buying
-
Table Of Contents
-
Feedback & Rating
Learning Responsive Data Visualization
By :
Until now, you learned a lot about animation, timers, interpolation, and easing, but does it really need all of this to do simple animations in D3. No; luckily, not as long as we use simple transitions. A Transition is an animation from a start state to one end state. The term is often used for animations in general and vice versa, but I want to emphasize that a transition is a simple animation that is defined by two states only; here, the interpolation between these states is automatically created from these states.
D3 has a very powerful support to create transitions. The only thing we have to do is to provide the starting state, call the .transition() method on a selection, and finally provide the ending state and D3 will take care of the rest. The .transition() method will return an object that is very similar to a selection and has most of its methods. In addition, it provides the .duration(duration), .delay(delay), and .easing(easingType) functions to define the duration...
Change the font size
Change margin width
Change background colour