Timer API in D3.js
A module of time API is applied to implement any concurrent animation along with the delay of synchronized timing. The Timer API applies a method called requestAnimationFrame to animation. This division will discuss this timer API.
requestAnimationFrame
The requestAnimationFrame communicates to a browser that we want to implement the animation. It will request the browser to call a described function for updating the animation.
Timer API Configuration
The following mentioned script can help us in loading this API easily from d3js.org.
Methods of Timer API
There are a few crucial methods of Timer API which are discussed below:
- now()
It is applied to return the latest time. It is also used to get a time amount in which any page was loaded. This particular time is defined in MS, and it will be useful in case we wish any event for triggering at a specific time. This method applies the performance.now for checking the elapsed time.
Note: In case the performance.now will not be present, then the d3.now will use the Date.now.
- timer(callback[, delay[, time]])
It is applied to schedule any timer and conjures a timer before stopped. The numeric delay can be converted into MS. But, this option is optional. Otherwise, it will default to zero. In case, no time is specified, it will be considered as the d3.now().
- restart(callback[, delay[, time]])
It is used for restarting any timer along with the described callback, time, and delay (optional).
- stop()
It is used to stop any timer, and prevent the subsequent callbacks. In case the timer has already been stopped, it will not include any effect.
- timeout(callback[, delay[, time]])
It is applied to stop any timer over its initial callback. The callback can be passed as an elapsed time.
- interval(callback[, delay[, time]])
It is conjured over an interval of specific time delay. In case, no delay is specified, it will take a timer time.
- timerFlush
It is applied to conjure the zero-delay timer’s callback immediately.
Consider the below example.
Example:
Output:
