nest.key() function in D3.js is used to register a new key function which is invoked for each element in the input array. Whenever a new key is registered, it is then pushed in the array to the end.
Syntax:
nest.keys(key)
Parameters:
- It takes only one parameter i.e the key function.
Return: It returns a string identifier.
Below given are few examples that explain the function in a better way.
Example 1:
<!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> .originalColor{ height: 100px; width: 100px; } .darkerColor{ height: 100px; width: 100px; } </style> <body> <!-- Fetching from CDN of D3.js --> <script type = "text/javascript" src = <script> let collection=[ {val:"val1"}, {val:"val2"}, {val:"val3"}, {val:"val4"} ] let data=d3.nest().key((d)=>{return d.val}) .entries(collection) console.log(data); </script> </body> </html> |
Output:
Example 2:
<!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> .originalColor{ height: 100px; width: 100px; } .darkerColor{ height: 100px; width: 100px; } </style> <body> <!--fetching from CDN of D3.js --> <script type = "text/javascript" src = </script> <script> let collection=[ {val:"val1", data:"data1", anotherData:"data1"}, {val:"val2", data:"data2", anotherData:"data2"}, {val:"val3", data:"data3", anotherData:"data3"}, {val:"val4", data:"data4", anotherData:"data4"} ] //key is added let data=d3.nest().key((d)=>{return d.val}) //another key is nested and added .key((d)=>{return d.data}) //another key is added and nested .key((d)=>{return d.anotherData}) .entries(collection) console.log(data); </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!
