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: