【问题标题】:Create multinested JSON from URL in Javascript for d3.js在 d3.js 的 Javascript 中从 URL 创建多嵌套 JSON
【发布时间】:2018-05-12 09:41:36
【问题描述】:

我有以下问题。我有一个可从 URL 获得的平面 json,我想用 Javascript 作为 d3.js 图表中的嵌套 JSON 加载该 json。我的代码如下:

d3.json('http://88.99.13.199:3000/measures', function(err, mydata) { 
   mydata.forEach(function(val) { 
      var measuresdata=[];
      var ent = [];
      var plir = [];
      var subm = [];
      ent.push({
          name: "entaxeis",
          size: val.entaxeis
      });
      plir.push({
          name: "pliromes",
          size: val.pliromes
      });
      subm.push({
          name: val.submeasure_code,
          children:{ent, plir}
      });
      measuresdata.push({
          name: val.measure_code,
          children:{subm}
      });
      console.log(measuresdata);
   });
   console.log(measuresdata);
}); 

我希望我的 json 如下:

{
   "name": "Μ01",
   "children": [
    {
     "name": "1.1",
     "children": [
      {"name": "entaxeis", "size": 456123},
      {"name": "pliromes", "size": 3812}
     ]
    }
   ]
  },
  {
   "name": "M03",
   "children": [
    {
     "name": "3.1",
     "children": [
      {"name": "entaxeis", "size": 456123},
      {"name": "pliromes", "size": 3812}
     ]
    },
   ]
 }
(..)

等等。这是一个难题,所以任何帮助都会很棒!

【问题讨论】:

    标签: javascript json d3.js


    【解决方案1】:

    由于您添加了d3.js标签,我认为最简单的解决方案是使用d3.nest()函数按键分组,然后在结果数组上使用map函数创建所需的结构:

    var nested = d3.nest()
      .key(function(d) { return d.measure_code; })
      .entries(mydata)
      .map(function(measure) {
        return {
          name: measure.key,
          children: measure.values.map(function(submeasure) {
            return {
              name: submeasure.submeasure_code,
              children: [
                { name: "entaxeis", size: submeasure.entaxeis },
                { name: "pliromes", size: submeasure.pliromes }
              ]
            };
          })
        };
      });
    

    【讨论】:

    • 我喜欢你的回答,但是我有一个问题。您的建议以所需格式成功创建了我的 JSON,但它为 eac measure_code 创建了一条记录,尽管有些名称相同。我希望它将所有子度量置于同一度量之下。
    • 我已经更新了答案,使用 d3.nest 按measure_code 对度量进行分组。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2016-11-25
    • 2016-08-16
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多