A transition operates on a selection of elements, animating changes in the DOM structure, attributes, or styles after updates. Transitions use interpolation to smoothly change from one state to another. You can configure durations and delays and choose up to 28 easing algorithms. Transitions use the browser's native display refresh rate (usually 60 frames per second), which guarantees fluid animations.
The d3-transition module contains all the functions used for transitions except for the easing algorithms, which are stored in d3-ease. Both are included in the default bundle.
Transitions can be created for any element. For example, you can create a new transition for the DOM root (document.documentElement) with d3.transition(), as shown in the following code (see Transitions/1-transition.html):
const transition = d3.transition();
A default transition starts immediately...
