Question

我想使用D3 v3.5.6将CSV字符串转换为Javascript对象，其中列名是键，其数据是数组。

我的JS到目前为止：

var csvString= 'date,dow,sp500,nasdaq\n1/1/16,10,15,8\n1/3/16,5,3,7\n1/5/16,12,18,12\n';
var headers = []
d3.csv.parse(csvString, function(data){
  headers = d3.keys(data);
});

这会使用列名称填充数组headers，但我无法弄清楚如何获取数据。

我想做一个像这样的对象：

{
  "date": ["1/1/16","1/3/16","1/5/16"],
  "dow": ["10","5","12"],
  ...
}

只有D3才有可能吗？

以下是易于阅读的CSV字符串：

date,dow,sp500,nasdaq
1/1/16,10,15,8
1/3/16,5,3,7
1/5/16,12,18,12

Answer 1

嗯，除了d3.csv.parse()之外，在我看来这个问题与D3没什么关系，可以用纯JavaScript来解决：

var csvString = 'date,dow,sp500,nasdaq\n1/1/16,10,15,8\n1/3/16,5,3,7\n1/5/16,12,18,12\n';

var data = d3.csv.parse(csvString);

var headers = d3.keys(data[0]);

var myObject = {};

headers.forEach(function(d) {
    myObject[d] = [];
});

data.forEach(function(d) {
    for (var key in d) {
        myObject[key].push(d[key]);
    }

});

console.log(myObject);

<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script>

Answer 2

使用下划线（只是因为我习惯了，你可以使用常规的js map / forEach）

var csvArray = csvDataString.split(',');
var keys = _.first(csvArray);
var values = _.rest(csvArray);
var asArrayOfObjects = _.map(values, function(row) {
  var mapping = {};
  _.each(row, function(rowItem, i) { mapping[keys[i]] = rowItem }, {});  
  return mapping;
});

Answer 3

此例程解析这些字符串的数组（假设格式一致），并将它们作为符合您想要的格式的字符串数组返回。如果你想要对象而不是字符串，修改函数（我发表评论）。您应该能够将此信息提供给D3。

   var d3Data = splitStockStrings ( [
                    'date,dow,sp500,nasdaq\n1/1/16,10,15,8\n1/3/16,5,3,7\n1/5/16,12,18,12\n',
                    'date,dow,sp500,nasdaq\n1/1/17,10,15,8\n1/3/17,5,3,7\n1/5/17,12,18,12\n'
                ] );
  console.log ( d3Data );

  function splitStockStrings ( stockStrings ) {
    var newStrings = [];

    stockStrings.forEach ( function ( d ) {             
      var final = [];
      d.split ( '\n' ).forEach ( function ( frag, i ) {
        if ( i > 0 && frag.split ( ',' ) [ 0 ] ) {
          final.push ( frag.split ( ',' ) [ 0 ] );
        }
      });

      var obj = { date : final };
      var json = JSON.stringify ( obj );
      newStrings.push ( json );
      // Or if you don't want strings,
      // comment out the above and uncomment the below...
      // newStrings.push ( obj );
    });

    return newStrings;
   }

D3：如何将CSV字符串解析为一个对象，其中键是列名，值是数据数组？

3 个答案: