The pow.rangeRound() function is used set the range of the scale to the specified array of values along with this it internally sets the interpolator to interpolatorRound.
Syntax:
pow.rangeRound([range]);
Parameters: This function takes a single parameter that is given above and described below.
- [range]: This is an array that contains the range for the domain specified.
Return Values: This function does not return anything.
Below given are a few examples of the function given above.
Example 1: When elements in range array are of type number.
<!DOCTYPE html> < html lang = "en" > < head > < meta charset = "UTF-8" /> < meta name = "viewport" path1tent=" width = device -width, initial-scale = 1 .0"/> < script src = </ script > < script src = </ script > < script src = </ script > < script src = </ script > </ head > < body > < h2 style = "color: green;" > Geeks for neveropen</ h2 > < p >pow.rangeRound() Function </ p > < script > var pow = d3.scalePow() // Domain ranges -1, +1 .domain([-1, +1]) // Range for the domain .rangeRound([10, 20, 30, 40, 50, 60, 70, 80, 90]); document.write("< br />< div >"); document.write("< p >With rangeRound()"); document.write("< h3 >"+pow(10.5)+"</ h3 >"); document.write("< h3 >"+pow(2)+"</ h3 >"); document.write("< h3 >"+pow(11.5)+"</ h3 >"); document.write("< h3 >"+pow(-1)+"</ h3 >"); document.write("< h3 >"+pow(1.15)+"</ h3 >"); document.write("< h3 >"+pow(5)+"</ h3 ></ div >"); var pow = d3.scaleLinear() // Domain ranges -1, +1 .domain([-1, +1]) // Range for the domain .range([10, 20, 30, 40, 50, 60, 70, 80, 90]) document.write("< br />< div >"); document.write("< p >Without rangeRound()"); document.write("< h3 >"+pow(10.5)+"</ h3 >"); document.write("< h3 >"+pow(2)+"</ h3 >"); document.write("< h3 >"+pow(11.5)+"</ h3 >"); document.write("< h3 >"+pow(-1)+"</ h3 >"); document.write("< h3 >"+pow(1.15)+"</ h3 >"); document.write("< h3 >"+pow(5)+"</ h3 ></ div >"); </ script > </ body > </ html > |
Output:
Example 2: When elements in range array are of type String.
<!DOCTYPE html> < html lang = "en" > < head > < meta charset = "UTF-8" /> < meta name = "viewport" path1tent=" width = device -width, initial-scale = 1 .0"/> < script src = </ script > < script src = </ script > < script src = </ script > < script src = </ script > </ head > < body > < h2 style = "color: green;" >Geeks for neveropen</ h2 > < p >pow.rangeRound() Function </ p > < script > var pow = d3.scalePow() // Domain ranges -1, +1 .domain([-1, +1]) // Range for the domain .rangeRound(["green", "blue", "red", "black", "white"]); document.write("< br />< div >"); document.write( "< p >d3.rangeRound() does not work with range of type string"); document.write("< h3 >"+pow(10.5)+"</ h3 >"); document.write("< h3 >"+pow(2)+"</ h3 >"); document.write("< h3 >"+pow(11.5)+"</ h3 >"); </ script > </ body > </ html > |
Output: