Skip to content
Related Articles

Related Articles

D3.js timer() function
  • Last Updated : 29 Jul, 2020

The D3.timer() function is used to run a timer function after a particular interval of time. The timer will run after a specified delay. The delay given is in milliseconds.

Syntax:

d3.timer(callback, delay);

Parameters: It takes the following two parameters.

  • callback: It is a function.
  • delay: It is the delay after which the function is executed.

Returns: It returns the Time of datatype Number.

Below given are a few examples of the above function.



Example 1:




<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport"
        content="width=device-width,
                 initial-scale=1.0">
  <title>Document</title>
</head>
<style>
</style>
<body>
  <!-- Fetching from CDN of D3.js -->
  <script type = "text/javascript"
          src = "https://d3js.org/d3.v4.min.js">
  </script>
  <script>
  let func=function(elapsed) {
      console.log(elapsed);
      if (elapsed > 500){
        console.log("Timer stopped")
        timer.stop();
      }
    }
   var timer = d3.timer(func);
  </script>
</body>
</html>

Output:

Example 2:




<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport"
        content="width=device-width,
                 initial-scale=1.0">
  <title>Document</title>
</head>
<style>
  .originalColor{
    height: 100px;
    width: 100px;
  }
  .darkerColor{
    height: 100px;
    width: 100px;
  }
</style>
<body>
  <!-- Fetching from CDN of D3.js -->
  <script type = "text/javascript" 
          src = "https://d3js.org/d3.v4.min.js">
  </script>
  <script>
  let func=function(e) {
      console.log(e);
      if (e>300){
        console.log("Timer stopped")
        timer.stop();
      }
    }
    // Delay of 2000ms
   var timer = d3.timer(func, 2000);
  </script>
</body>
</html>

Output:

My Personal Notes arrow_drop_up
Recommended Articles
Page :