嵌套JSON阵列和D3JS [英] Nested JSON array and D3JS

问题描述

我试图用一个嵌套的JSON数组来绘制与d3.js.多系列图表我看了很多关于本网站和其他地方，虽然也有类似的话题，我似乎无法使语法工作，我的具体问题（这是一个简单的）。

要制作线图（喜欢这里了一句： http://bl.ocks.org/mbostock / 3883245 ），我可以分析这个JSON文件：

<$p$p><$c$c>[{\"date\":\"1-May-12\",\"close\":58.13},{\"date\":\"30-Apr-12\",\"close\":53.98},{\"date\":\"27-Apr-12\",\"close\":67}]

通过使用该JavaScript语法：

  d3.json（数据/ data2.json功能（错误数据）{
data.forEach（函数（D）{
    d.date = parseDate（d.date）;
    d.close = + d.close;
}）;
 

但是，如果JSON是一个嵌套数组？例如：

  {
\"Stock01\":[{\"date\":\"1-May-12\",\"close\":58.13},{\"date\":\"30-Apr-12\",\"close\":53.98},{\"date\":\"27-Apr-12\",\"close\":67}]
\"Stock02\":[{\"date\":\"1-May-12\",\"close\":28.13},{\"date\":\"30-Apr-12\",\"close\":33.98},{\"date\":\"27-Apr-12\",\"close\":47}]
}
 

我试着像下面的脚本选项，但我没有任何运气：

  d3.json（数据/ data2.json功能（错误数据）{
data.forEach（函数（D）{
    d.date = parseDate（D [0] .date）;
    d.close = + D [0] .close;
}）;
 

如果任何人有如何导航嵌套JSON数组与data.forEach功能的建议，我会很感激。感谢您事先的任何帮助。

解决方案

您要遍历数据的钥匙，用钥匙来查找数据对应的值，并在值进行操作。

您想是这样的：

  d3.json（数据/ data2.json功能（错误数据）{
    对（K数据）{
        VAR k_data =数据[K];
        k_data.forEach（函数（D）{
            d.date = parseDate（D [0] .date）;
            d.close = + D [0] .close;
        }）;
    }
}）;
 

此外，它看起来像的forEach 需要有两个参数，一个函数键和值：

 的forEach：函数（f）{
  为（在此变种键）{
    如果（key.char $ C $猫（0）=== d3_map_ preFIX code）{
      f.call（此，key.substring（1），此[键]）;
    }
  }
}
 

例如：

 值：函数（）{
  变种值= [];
  this.forEach（功能（键，值）{
    values​​.push（值）;
  }）;
  返回值;
}
 

---

后来：AmeliaBR约的forEach 正确的：它不适用于对对象/词典的使用。

 变种一个= {stock1：[1，2，3，4]，stock2：[2，3，5，7]，stock3：[1 ，2，4,8-]};
a.forEach（功能（值，键）{执行console.log（值，键）;}）;
/ *类型错误：对象＃＆LT;对象＆gt;没有法的forEach'* /
 

但这个作品：

  A [stock1]的forEach（功能（值，键）{执行console.log（值，键）;}）;
1 0
2 1
3 2
4 3
 

I'm trying to use a nested json array to graph a multi-series chart with d3.js. I've looked a lot of places on this site and others, and while there are similar topics, I can't seem to make the syntax work with my specific problem (which is a simple one).

To make a line chart (like the one here: http://bl.ocks.org/mbostock/3883245), I can parse this JSON file:

[{"date":"1-May-12","close":58.13},{"date":"30-Apr-12","close":53.98},{"date":"27-Apr-12","close":67}]

By using this javascript syntax:

d3.json("data/data2.json", function(error, data) {              
data.forEach(function(d) {                              
    d.date = parseDate(d.date);                         
    d.close = +d.close;                                 
});

But what if the JSON is a nested array? For example:

{
"Stock01":[{"date":"1-May-12","close":58.13},{"date":"30-Apr-12","close":53.98},{"date":"27-Apr-12","close":67}]
"Stock02":[{"date":"1-May-12","close":28.13},{"date":"30-Apr-12","close":33.98},{"date":"27-Apr-12","close":47}]
}

I've tried options like the script below, but I'm not having any luck:

d3.json("data/data2.json", function(error, data) {              
data.forEach(function(d) {                              
    d.date = parseDate(d[0].date);                          
    d.close = +d[0].close;                                  
});

If anyone has advice for how to navigate a nested JSON array with the data.forEach function, I'd be grateful. Thanks in advance for any help.

解决方案

You want to iterate over the keys in data, use the key to look up the corresponding value in data, and operate on the values.

You want something like this:

d3.json("data/data2.json", function(error, data) {
    for (k in data) {
        var k_data = data[k];
        k_data.forEach(function(d) {                              
            d.date = parseDate(d[0].date);                          
            d.close = +d[0].close;                               
        });
    }
});

Also, it looks like forEach takes a function that has two arguments, key and value:

forEach: function(f) {
  for (var key in this) {
    if (key.charCodeAt(0) === d3_map_prefixCode) {
      f.call(this, key.substring(1), this[key]);
    }
  }
}

For example:

values: function() {
  var values = [];
  this.forEach(function(key, value) {
    values.push(value);
  });
  return values;
}

---

Later: AmeliaBR is correct about forEach: it is not available for use on objects/dictionaries.

var a = {"stock1": [1, 2, 3, 4], "stock2": [2, 3, 5, 7], "stock3": [1,2, 4,8]};
a.forEach(function(value, key){ console.log(value, key);});
/* TypeError: Object #<Object> has no method 'forEach' */

But this works:

a["stock1"].forEach(function(value, key){ console.log(value, key);});
1 0
2 1
3 2
4 3

这篇关于嵌套JSON阵列和D3JS的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！