首页 > 解决方案 > 如何将类似列表的数据导入d3?

问题描述

我对 D3 还很陌生,我无法以某种方式加载和解析数据。

我希望我可以根据数据本身和我希望生成的图像将一些数据加载到我的 javascript 中,如果我可以按以下方式加载和解析数据,那就太棒了:

{field:fieldname, data:[1,2,3,4...]} //an array

我使用了另一个 python 代码来生成所有数据,并且我尝试了不同的方式来编写这些信息。

例如,我尝试使用 csv 要么

field     ,data,data,data,data
fieldnameA,1   ,2   ,3   ,4....
fieldnameB,1   ,2   ,3   ,4....
......

或转置版本:

fieldnameA, fieldnameB, fieldnameC...
1         , 1         , 1         ...
2         , 2         , 2         ...
...        ...        ...

我无法工作,我能找到的所有其他示例都采用如下格式,这与我的目标完全不同:

filed     , data    
fieldnameA, 1
fieldnameB, 2
fieldnameC, 3

我想知道我是否可以粗暴地将我的 csv 写为:

field     , data
fieldnameA, [1,2,3,4...]
fieldnameB, [1,2,3,4...]

但后来我被困在 D3 中解析列表...

我在这里最好的选择是什么?我应该考虑从 python 写入 JSON 吗?我真的很感激一些帮助!

标签: javascriptcsvd3.js

解决方案


如果您可以控制源数据,最简单的方法是使用 JSON 格式:

[{
    field: "fieldnameA",
    data: [1,2,3,4...],
},{
    field: "fieldnameA",
    data: [1,2,3,4...],
}];

然后就可以加载数据了。D3 可以在使用d3.json时做到这一点,只需注意这在最新的 V5 版本中已更改为返回一个承诺。

d3.json("myData.json", function(data){

});

推荐阅读