在 D3 中读取没有标题行的 csv/tsv

Posted 2023-02-22

【中文标题】在 D3 中读取没有标题行的 csv/tsv

【英文标题】：read csv/tsv with no header line in D3

【发布时间】：2012-12-01 22:59:19

【问题描述】：

我的 CSV 数据类似于：

数据

1,1,10
1,2,50
1,3,5
etc...

我正在尝试读取数据。但是，我的初始数据不包含标题行（如上所示），因此它将第一个数据行作为标题 (1,1,10)。有没有办法解决。我想在读取数据后设置标题名称

javascript

d3.csv("data/testnh.csv", function(data) 
    console.log(data);

谢谢！

【参考方案1】：

使用d3.text 加载数据，然后使用d3.csvParseRows 解析它。例如：

d3.text("data/testnh.csv", function(text) 
  console.log(d3.csvParseRows(text));
);

您可能还希望将列转换为数字，因为默认情况下它们是字符串。假设它们是所有个数字，你可以说：

d3.text("data/testnh.csv", function(text) 
  var data = d3.csvParseRows(text).map(function(row) 
    return row.map(function(value) 
      return +value;
    );
  );
  console.log(data);
);

【讨论】：

嗯，这行得通，但是，我需要在解析所有行后调用的回调。我正在尝试实现热图，请参阅：jsfiddle.net/QWLkR/2 输入文件没有标题

与 d3.csv 不同，d3.csv.parse 和 d3.csv.parseRows 是同步的，因此不需要回调。返回值（上面的data）在您调用 d3.csv.parseRows 后即可立即使用。唯一的异步部分是通过 d3.text 加载文件。

如果不是所有解析的列都属于同一类型，并且您不想将所有列都转换为数字，而是说只有第二列和第四列应该是数字，该怎么办？

上述函数会在html文件的script标签中。但是如何在html文件的body中调用这个函数呢？

对于较新版本的 d3，将 csvParseRows 替换为 csv.parseRows。

【参考方案2】：

自从 Bostock 在 2012 年的回答以来，d3.csv.parseRows 允许一个可选的访问器函数，这使得他的回答能够更简洁地表达：

d3.text("data/testnh.csv", function(text) 
    var data = d3.csv.parseRows(text, function(d) 
        return d.map(Number);
    );
    // Now do something with data
);

【参考方案3】：

首先使用d3.text读入数据，然后添加自定义头字符串，然后使用d3.csv.parse解析结果

d3.text("data/testnh.csv", function(r)
   var result = "x, y, z\n" + r;  //now you have the header
   var data = d3.csv.parse(result);
   //do your plotting with data

【讨论】：

对于 D3v4+，使用 d3.csvParse(result) 代替 d3-dsv 包中的 d3.csv.parse()

【参考方案4】：

试试 d3.csvParse(text)

d3.csv.parseRows 似乎在现代 d3 版本中不起作用。