The intepolateString() function in D3.js is used to return the interpolator function between two strings. For each number in string “b” the function finds a number for it in string “a”, then it returns the interpolation of these numbers using Number interpolator function, and the remaining part of string “b” is used as a template.
Syntax:
d3.intepolateString(a, b);
Parameters: It takes two parameters:
- a: It is a string of characters and numbers.
- b: It is also a string of characters and numbers.
Returns: It returns the interpolator function.
Below given are a few examples of the above 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>Document</title></head><style></style><body> <!--fetching from CDN of D3.js --> <script type = "text/javascript" src = </script> <script> let s1="42 neveropen 16"; let s2="500 Geeks 10 for 20 neveropen" let interpolatoreFunc=d3.interpolateString(s1, s2); /* Note that the string alphabets of string b are same as output but the Numbers are changed.*/ console.log(interpolatoreFunc(0.25)) console.log(interpolatoreFunc(5)) console.log(interpolatoreFunc(0)) console.log(interpolatoreFunc()) </script></body></html> |
Output:
Example 2:
html
<!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> try{ // Trying numbers with this function console.log(d3.interpolateString(24, 15)(0.26)) // If only string is given and no Number console.log(d3.interpolateString("neveropen", "for Geeks")(0.5)) // If a is a number and b is a string console.log(d3.interpolateString(24, "Geeks for neveropen")(0.8)) // If a is not given console.log(d3.interpolateString("13 neveropen")(0.46)) console.log(typeof d3.interpolateString("2 asda", "13 neveropen")) } catch(err){ throw err; } </script></body></html> |
Output:
Whether you’re preparing for your first job interview or aiming to upskill in this ever-evolving tech landscape, neveropen Courses are your key to success. We provide top-quality content at affordable prices, all geared towards accelerating your growth in a time-bound manner. Join the millions we’ve already empowered, and we’re here to do the same for you. Don’t miss out – check it out now!
… [Trackback]
[…] There you can find 81975 additional Information to that Topic: geeksforgeeks.org/d3-js-interpolatestring-function/ […]