使用d3.nest和rollup进行数组操作 [英] Array manipulation with d3.nest and rollup

查看:467
本文介绍了使用d3.nest和rollup进行数组操作的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

这是我要重现的数组:

  [{plts:'Zlnd',values:{'150k' :4786,'200k':1319,'250k':249}} 
,{plts:'Hsls',values:{'150k':1101,'200k':412,'250k':674} ]

但是,我没有超越的地方1)给我在'plts'级别的总和,而不是任何细节元素2)总和位于'值'的叶级,但我需要它在'plts'级。



使用此方法从mysql获取平面数据(它可以工作,但尚未给出分组的值):

  d3.json(php / data3.php,function(error,JsonData){
JsonData.forEach(function(d){
d ['150k'] = + d ['150k'];
d ['200k'] = + d ['200k'];
d ['250k'] = + d ['250k'];

结果:

  [{plts:Zlnd,150k:4786,200k:1319,250k:249} 
,{plts:Hsls,150k :1101,200k:412,250k:674}

平面数组到我需要的:

  var nested_data = d3.nest()
.key ){return d.plts;})
.rollup(function(v){
return {
total:d3.sum(v,function(g){return + g ['150k '] + g ['200k'] + g ['250k'];})
};
})
.entries(JsonData)
}

任何帮助都非常感谢!

解决方案

这不是 d3.nest 的用例。如果您的数据采用以下形式,则适合使用Nest:

  [
{plts:Zlnd, bin:150k,amount:4786},
{plts:Zlnd,bin:200k,amount:1319},
:Zlnd,bin:250k,amount:249},
{plts:Hsls,bin:150k,amount:1101} b $ b {plts:Hsls,bin:200k,amount:412},
{plts:Hsls,bin:250k :674}
]

然后


$ b b

  d3.nest()
.key(function(d){return d.plts;})
.entries(JsonData)

会产生

  [
{key:Zlnd,values:[
{plts:Zlnd,bin:150k,amount:4786},
{ plts:Zlnd,bin:200k,amount:1319},
{plts:Zlnd,bin:250k,amount:249} b $ b]},
{key:Hsls,values:[
{plts:Hsls,bin:150k,amount:1101},
{plts:Hsls,bin:250k,bin:200k,amount:412} :674}
]}
]

p>

  .rollup(function(values){
return d3.sum(values,function(v){return v.amount ; });
})

产生

  [
{key:Zlnd,values:6354},
{key:Hsls,values:2184}
]

您也可以使用

  d3.nest()
.key(function(d){return d.bin;})
.entries(JsonData)
pre>

这将产生

  [
{key :150k,值:[
{plts:Zlnd,bin:150k,amount:4786},
{plts:Hsls bin:150k,amount:1101}
]},
{key:200k,values:[
{plts:Zlnd :200k,amount:1319},
{plts:Hsls,bin:200k,amount:412}
]},
{key:250k,values:[
{plts:Zlnd,bin:250k,amount:249},
{plts:Hsls ,bin:250k,amount:674}
]}
]

这样,你可以使用汇总来获得每个bin的总和 - 所有plts。



希望有意义。不知道这是否是你想要实现的,但它让你知道什么巢是有益的。如果这一切都不适用,只需使用vanilla javascript从您加载的数据中获取您想要的值,然后跳过使用d3.nest。


This is the array I want to reproduce:

[{ plts: 'Zlnd', values: { '150k': 4786, '200k': 1319, '250k': 249 }}
,{ plts: 'Hsls', values: { '150k': 1101, '200k': 412, '250k': 674 }}]

However, I don't get beyond the point of where 1) I have a grouping which just gives me a total sum at 'plts' level and not any of the detail elements and 2) the sum is located at the leaf level of 'values', but I need it to be at the 'plts'level.

Using this to get the flat data from mysql (which works, but does not yet give the values for the grouping):

 d3.json("php/data3.php", function (error, JsonData) {
            JsonData.forEach(function (d) {
                d['150k'] = +d['150k'];
                d['200k'] = +d['200k'];
                d['250k'] = +d['250k']; 

The result:

[{"plts":"Zlnd","150k":4786,"200k":1319,"250k":249}
,{"plts":"Hsls","150k":1101,"200k":412,"250k":674}

and this to format the flat array to the one I need:

        var nested_data = d3.nest()
             .key(function (d) { return d.plts; })
             .rollup(function (v) {
                      return {
                      total: d3.sum(v, function (g) { return +g['150k'] + g['200k'] + g['250k'];})
                             };
                       })
                      .entries(JsonData)
                  });

Any help is very appreciated!

解决方案

This is not the use case for d3.nest. Nest would be appropriate if your data was in the form:

[
    { "plts": "Zlnd", "bin": "150k", "amount": 4786 },
    { "plts": "Zlnd", "bin": "200k", "amount": 1319 },
    { "plts": "Zlnd", "bin": "250k", "amount": 249 },
    { "plts": "Hsls", "bin": "150k", "amount": 1101 },
    { "plts": "Hsls", "bin": "200k", "amount": 412 },
    { "plts": "Hsls", "bin": "250k", "amount": 674 }
]

Then

d3.nest()
  .key(function (d) { return d.plts; })
  .entries(JsonData)

Would produce

[
  { key: "Zlnd", values: [
    { "plts": "Zlnd", "bin": "150k", "amount": 4786 },
    { "plts": "Zlnd", "bin": "200k", "amount": 1319 },
    { "plts": "Zlnd", "bin": "250k", "amount": 249 }
  ] },
  { key: "Hsls", values: [
    { "plts": "Hsls", "bin": "150k", "amount": 1101 },
    { "plts": "Hsls", "bin": "200k", "amount": 412 },
    { "plts": "Hsls", "bin": "250k", "amount": 674 }
  ] }
]

which you could rollup using

.rollup(function(values) {
  return d3.sum(values, function(v) { return v.amount; });
})

producing

[
  { key: "Zlnd", values: 6354 },
  { key: "Hsls", values: 2184 }
]

You can also use

d3.nest()
  .key(function (d) { return d.bin; })
  .entries(JsonData)

which would produce

[
  { key: "150k", values: [
    { "plts": "Zlnd", "bin": "150k", "amount": 4786 },
    { "plts": "Hsls", "bin": "150k", "amount": 1101 }
  ] },
  { key: "200k", values: [
    { "plts": "Zlnd", "bin": "200k", "amount": 1319 },
    { "plts": "Hsls", "bin": "200k", "amount": 412 }
  ] },
  { key: "250k", values: [
    { "plts": "Zlnd", "bin": "250k", "amount": 249 },
    { "plts": "Hsls", "bin": "250k", "amount": 674 }
  ] }
]

That way you can similarly use rollup to get the sum total of each bin — across all plts.

Hope that makes sense. Not sure if this is what you're trying to achieve, but it gives you a sense of what nest is good for. If none of this applies, just use vanilla javascript to derrive the values you want from the data you're loading and skip using d3.nest.

这篇关于使用d3.nest和rollup进行数组操作的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆