d3.js nest.entries()用法及代碼示例

D3.js中的nest.entries()函數用於生成嵌套，並將嵌套運算符應用於層次結構的每個級別，而不僅是最外層。

用法:

nest.entries(array)

參數：它僅采用上麵給出和下麵描述的一個參數。

Array:它是對象的數組。

返回值：它返回鍵值條目的數組。

下麵給出了上述函數的一些示例。

範例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> 
</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>

輸出：

範例2：嵌套時使用entry函數。

<!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>

輸出：

相關用法

注：本文由純淨天空篩選整理自tarun007大神的英文原創作品 D3.js nest.entries() function。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。