Saturday, December 28, 2024
Google search engine
HomeLanguagesJavascriptD3.js nest.entries() function

D3.js nest.entries() function

The nest.entries() function in D3.js is used to generate the nest and is applies a nest operator to every level of hierarchy rather than the outmost layer only.

Syntax:

nest.entries(array)

Parameters: It takes only one parameter given above and described below.

  • Array: It is the array of objects.

Return Value: It returns the array of key-value entries.

Below given are a few examples of the above function.

Example 1: When no entries function is used and keys are assigned.




<!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>
</style>
<body>
  <!-- Fetching from CDN of D3.js -->
  <script type = "text/javascript" 
          src = "https://d3js.org/d3.v4.min.js">
  </script>
  <script>
    // Forming the array of objects
    let array=[
      {val:"val10", data:"data11"},
      {val:"val20", data:"data22"},
      {val:"val30", data:"data33"},
      {val:"val30", data:"data33"},
      {val:"val30", data:"data33"},
      {val:"val50", data:"data33"},
      {val:"val40", data:"data44"}
    ]
    let data= d3.nest()
                  .key(function(d) { return d.val; })
    console.log(data);
  </script>
</body>
</html>


Output:

Example 2: When entries function is used with the nest.




<!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>
</style>
<body>
  <!-- Fetching from CDN of D3.js -->
  <script type = "text/javascript" 
          src = "https://d3js.org/d3.v4.min.js">
 </script>
  <script>
    // Forming the array of objects
    let array=[
      {val:"val10", data:"data11"},
      {val:"val20", data:"data22"},
      {val:"val30", data:"data33"},
      {val:"val30", data:"data33"},
      {val:"val30", data:"data33"},
      {val:"val50", data:"data33"},
      {val:"val40", data:"data44"}
    ]
    let data= d3.nest()
                  .key(function(d) { return d.val; })
                  .entries(array)
    console.log("Type is: ", typeof array)
    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!

RELATED ARTICLES

Most Popular

Recent Comments