Skip to content
Related Articles

Related Articles

D3.js nest.key() Function
  • Last Updated : 19 Jul, 2020

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:

My Personal Notes arrow_drop_up
Recommended Articles
Page :