当前位置: 首页>>代码示例 >>用法及示例精选 >>正文


d3.js group()用法及代码示例


借助d3.group()方法,我们可以将可迭代的数据结构分组到一个映射中,其中将键定义为可迭代的元素,并将值定义为数组。

用法:

d3.group( iterable, ...keys )

返回值:它返回具有键作为元素和值作为数组的映射。

注意:要执行以下示例,您必须使用此命令提示符安装d3库,我们必须执行以下命令。

npm install d3

范例1:在此示例中,我们可以通过使用d3.group()方法看到这一点。我们可以从可迭代的组中获取映射,其中键是元素,值是数组。



Javascript

// Defining d3 contrib variable   
var d3 = require('d3'); 
  
data = [ 
  {name:"ABC", amount:"34.0",   date:"11/12/2015"}, 
  {name:"DEF", amount:"120.11", date:"11/12/2015"}, 
  {name:"MNO", amount:"12.01",  date:"01/04/2016"}, 
  {name:"XYZ", amount:"34.05",  date:"01/04/2016"} 
] 
  
var grouped_data = d3.group(data, d => d.name) 
  
console.log(grouped_data)

输出:

Map {
‘ABC’ => [ { name:‘ABC’, amount:‘34.0’, date:’11/12/2015′ } ],
‘DEF’ => [ { name:‘DEF’, amount:‘120.11’, date:’11/12/2015′ } ],
‘MNO’ => [ { name:‘MNO’, amount:‘12.01’, date:’01/04/2016′ } ],
‘XYZ’ => [ { name:‘XYZ’, amount:‘34.05’, date:’01/04/2016′ } ]
}

范例2:

Javascript

// Defining d3 contrib variable   
var d3 = require('d3'); 
  
data = [ 
  {name:"ABC", amount:"34.0",   date:"11/12/2015"}, 
  {name:"DEF", amount:"120.11", date:"11/12/2015"}, 
  {name:"MNO", amount:"12.01",  date:"01/04/2016"}, 
  {name:"XYZ", amount:"34.05",  date:"01/04/2016"} 
] 
  
var grouped_data = d3.group(data,  
        d => d.name, d => d.amount) 
  
console.log(grouped_data)

输出:

Map {
  'ABC' => Map { '34.0' => [ [Object] ] },
  'DEF' => Map { '120.11' => [ [Object] ] },
  'MNO' => Map { '12.01' => [ [Object] ] },
  'XYZ' => Map { '34.05' => [ [Object] ] } 
}

相关用法


注:本文由纯净天空筛选整理自Jitender_1998大神的英文原创作品 D3.js group() Method。非经特殊声明,原始代码版权归原作者所有,本译文未经允许或授权,请勿转载或复制。