The d3.scaleQuantile() function in D3.js is used to create and return a new quantile scale that has the specified domain and range. In case the domain or the range is not specified, each value is set to empty array by default.
Syntax:
d3.scaleQuantile( domain, range )
Parameters: This function accepts two parameters as given above and described below:
- domain: It is an array of only integers that defines the extent of domain values. It is an optional parameter. The default value is set to empty array.
- range: It is an array of integers or strings. It is an optional parameter. The default value is set to empty array.
Return Values: This function does not return anything.
Below programs illustrate the d3.scaleQuantile() function in D3.js:
Example 1:
HTML
<!DOCTYPE html> < html > < head > </ script > </ script > < script src = </ script > < script src = </ script > </ head > < body > < h1 style = "color: green;" >neveropen</ h1 > < p >d3.ScaleQuantile() Function </ p > < script > // Using scaleQuantile function var quantile = d3.scaleQuantile() .domain([0, 1]) .range(["blue", "yellow", "green"]); document.write("< h3 >" + quantile(0) + "</ h3 >"); document.write("< h3 >" + quantile(0.3) + "</ h3 >"); document.write("< h3 >" + quantile(0.5) + "</ h3 >"); document.write("< h3 >" + quantile(0.9) + "</ h3 >"); </ script > </ body > </ html > |
Output:
Example 2:
HTML
<!DOCTYPE html> < html > < head > </ script > </ script > < script src = </ script > < script src = </ script > </ head > < body > < h1 style = "color: green;" > neveropen </ h1 > < p >d3.ScaleQuantile() Function </ p > < script > // Using the scaleQuantile function var quantile = d3.scaleQuantile() .domain([0, 1]) .range([1, 100]); document.write("< h3 >" + quantile(0) + "</ h3 >"); document.write("< h3 >" + quantile(0.3) + "</ h3 >"); document.write("< h3 >" + quantile(0.5) + "</ h3 >"); document.write("< h3 >" + quantile(0.9) + "</ h3 >"); </ script > </ body > </ html > |
Output: