如何加载 tsv 文件以与 D3 一起使用

Question

我正在尝试了解如何在我的 D3 项目中使用 tsv 文件。我看过 https://github.com/mbostock/d3/wiki/CSV

在评论的一些帮助下，这是我现在的代码

d3.tsv.parse(d3.select("ballet.tsv").text(), function(d){
    d3.select("body").append("div")
        .text(d.year);
});

我的数据是这样的

year    production  Company
1996    Impressions of Sophie (1996)    National Youth Ballet of Great Britain
1996    Lavender's Blue (1996)  National Youth Ballet of Great Britain
1940    Les Sylphides (1940)    The Vic-Wells Ballet

等等

非常感谢任何帮助，谢谢

Answer 1

正如@Lars 在评论中指出的那样，d3.tsv.parse 是异步的，因此所有用于 data 操作的代码都应该 wrapped 在回调函数中（documentation 中的 accessor 参数）。基本代码结构如下：

d3.tsv.parse(d3.select("#tsv").text(), function(d){
    //The code below will be called for each row in the tsv file
    d3.select("body").append("div")
      .text(d.year);

    //More data manipulation
});

这里是working fiddle.

如何加载 tsv 文件以与 D3 一起使用

How to load tsv file to use with D3

d3.js