javascript d3根据一组数据创建数据集

时间:2018-10-06 18:14:56

标签: javascript d3.js

我有一个对象数组,而我想做的是基于值是否等于某值的单独条目。我正在从csv中读取数据,并将某些字符串更改为类似int的

d3.csv('mydata.csv', function(error, data){

  data.forEach(function(d){

d["Fruits"] = +d["Fruits"]
d["Stores"] = +d["Stores"]
d["Names of Fruits"] = d["Names of Fruits"]

});
});

这是我原始数据的外观。 mydata

Array(10) [ {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…} ]

对象看起来像这样

"Fruits": 5
"Stores": 22
"Names of Fruits": "oranges",

"Fruits": 100
"Stores": 3
"Names of Fruits": "apples",


"Fruits": 10
"Stores": 300
"Names of Fruits": "pear",

"Fruits": 10
"Stores": 300
"Names of Fruits": "apple",

等 要获取此数据,我可以调用console.log(data),以上所有内容都会显示在控制台中。我希望能够根据“水果名称”值将它们分开。因此可能会想调用console.log(appleData),结果将是

 "Fruits": 100
"Stores": 3
"Names of Fruits": "apples",

"Fruits": 10
"Stores": 300
"Names of Fruits": "apple",

与orangeData,pearData等相同

为此,我尝试了

 d3.csv('mydata.csv', function(error, data){

  appleData = data.forEach(function(d){

    if(d["Names of Fruits"] =="apple"){

      d["Fruits"] = +d["Fruits"]
      d["Stores"] = +d["Stores"]
      d["Names of Fruits"] = d["Names of Fruits"]

  }
 });

    orangeData = data.forEach(function(d){

    if(d["Names of Fruits"] =="orange"){

      d["Fruits"] = +d["Fruits"]
      d["Stores"] = +d["Stores"]
      d["Names of Fruits"] = d["Names of Fruits"]

  }
 });

});

1 个答案:

答案 0 :(得分:1)

很多方法可以做到这一点;这是几个例子。第一个使用d3.nest并将数据转换为数组数组,其中外键为水果的名称。第二个是一些手工编写的代码,它返回一个具有每种水果属性的对象。哪种方法最有效,实际上取决于您更大的用例。

<!DOCTYPE html>
<html>

  <head>
    <script data-require="d3@4.0.0" data-semver="4.0.0" src="https://d3js.org/d3.v4.min.js"></script>
  </head>

  <body>
    <script>
    var data = [{
        "Fruits": 5,
        "Stores": 22,
        "Names of Fruits": "oranges"
      }, {
        "Fruits": 100,
        "Stores": 3,
        "Names of Fruits": "apple"
      },
      {
        "Fruits": 10,
        "Stores": 300,
        "Names of Fruits": "pear"
      },

      {
        "Fruits": 10,
        "Stores": 300,
        "Names of Fruits": "apple"
      }
    ];
    
    console.log(
      d3.nest()
        .key(function(d) { return d["Names of Fruits"]; })
        .entries(data)
    );
    
    var rv = {};
    data.forEach(function(d){
      if (!rv[d["Names of Fruits"]]) rv[d["Names of Fruits"]] = [];
      rv[d["Names of Fruits"]].push(d);
    });
    console.log(rv);
      
  </script>
  </body>

</html>

相关问题