The d3.interpolateNumber() Function is used to return the interpolator between two given numbers. It is almost the same as d3.interpolate() function except that it takes only numbers as parameters.
Syntax:
d3.interpolateNumber(a,b);
Parameters: This function accepts two parameters as mentioned above and described below.
- a: It is any number on the number line.
- b: It is any number on the number line.
Return Values: This function returns interpolator between two given numbers.
Below given are a few Examples of d3.interpolateNumber() function
Example 1:
HTML
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>D3.js d3.interpolateNumber() Function</title> </head> <style> </style> <body> <!--Fetching from CDN of D3.js --> <script type = "text/javascript" src = </script> <script> let intr = d3.interpolateNumber(2458,9586) console.log("Type of returned function is: ",typeof(intr)); console.log(intr(0.1)) console.log(intr(1)) console.log(intr(0.4)) </script> </body> </html> |
Output:
Example 2: When the number given is negative and one of them is not a number.
HTML
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>D3.js d3.interpolateNumber() Function</title> </head> <style> </style> <body> <!--Fetching from CDN of D3.js --> <script type = "text/javascript" src = </script> <script> console.log(d3.interpolateNumber(-263,586)(0.2)) console.log(d3.interpolateNumber(-263,"green")(0.1)) console.log(d3.interpolateNumber("yellow","red")(0.1)) </script> </body> </html> |
Output:


… [Trackback]
[…] Read More on that Topic: geeksforgeeks.org/d3-js-interpolatenumber-function-2/ […]