The d3.schemeSet2 Method in D3.js is used to return an array of eight categorical colors which is returned as RGB hexadecimal strings.
Syntax:
d3.schemeSet2
Parameters: This method does not accept any parameter.
Return Values: It returns an RGB hexadecimal string.
Example 1:
HTML
<!DOCTYPE html> < html > < head > </ script > < script src = </ script > < script src = </ script > < script src = </ script > </ head > < body > < center > < h1 style = "color:green;" >GeeksForGeeks</ h1 > < h3 >D3.js schemeSet2 Method</ h3 > < script > document.write(d3.schemeSet2[0]+"< br >"); document.write(d3.schemeSet2[1]+"< br >"); document.write(d3.schemeSet2[2]+"< br >"); document.write(d3.schemeSet2[3]+"< br >"); document.write(d3.schemeSet2[4]+"< br >"); document.write(d3.schemeSet2[5]+"< br >"); document.write(d3.schemeSet2[6]+"< br >"); document.write(d3.schemeSet2[7]+"< br >"); </ script > </ center > </ body > </ html > |
Output:
Example 2:
HTML
<!DOCTYPE html> < html > < head > </ script > < script src = </ script > < script src = </ script > < script src = </ script > < style > div { padding: 3px; width: fit-content; height: 20px; width: 250px; } </ style > </ head > < body > < center > < h1 style = "color:green;" >GeeksForGeeks</ h1 > < h3 >D3.js schemeSet2 Method</ h3 > < div class = "b1" > < span > D3.schemeSet2[0] </ span > </ div > < div class = "b2" > < span > D3.schemeSet2[1] </ span > </ div > < div class = "b3" > < span > D3.schemeSet2[2] </ span > </ div > < div class = "b4" > < span > D3.schemeSet2[3] </ span > </ div > < div class = "b5" > < span > D3.schemeSet2[4] </ span > </ div > < div class = "b6" > < span > D3.schemeSet2[5] </ span > </ div > < div class = "b7" > < span > D3.schemeSet2[6] </ span > </ div > < div class = "b8" > < span > D3.schemeSet2[7] </ span > </ div > < script > // Array of colors is given let color1 = d3.schemeSet2[0]; let color2 = d3.schemeSet2[1]; let color3 = d3.schemeSet2[2]; let color4 = d3.schemeSet2[3]; let color5 = d3.schemeSet2[4]; let color6 = d3.schemeSet2[5]; let color7 = d3.schemeSet2[6]; let color8 = d3.schemeSet2[7]; let b1 = document.querySelector(".b1"); let b2 = document.querySelector(".b2"); let b3 = document.querySelector(".b3"); let b4 = document.querySelector(".b4"); let b5 = document.querySelector(".b5"); let b6 = document.querySelector(".b6"); let b7 = document.querySelector(".b7"); let b8 = document.querySelector(".b8"); b1.style.backgroundColor = color1; b2.style.backgroundColor = color2; b3.style.backgroundColor = color3; b4.style.backgroundColor = color4; b5.style.backgroundColor = color5; b6.style.backgroundColor = color6; b7.style.backgroundColor = color7; b8.style.backgroundColor = color8; </ script > </ center > </ body > </ html > |
Output: