如何加载要与D3一起使用的tsv文件 [英] How to load tsv file to use with D3

问题描述

我试图弄清楚如何在我的D3项目中使用tsv文件.我看过 https://github.com/mbostock/d3/wiki/CSV

I'm trying to figure out how to use a tsv file in my D3 projects. I have looked at https://github.com/mbostock/d3/wiki/CSV

这是我的代码，经过注释的帮助之后

This is my code now after some help from the comments

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

等

任何帮助将不胜感激，谢谢

Any help would be much appreciated, thanks

推荐答案

正如@Lars在注释中指出的那样，d3.tsv.parse是异步的，因此所有用于data操作的代码都应包装在回调函数中(文档中的accessor参数).基本代码的结构应如下:

As @Lars pointed out in the comment, d3.tsv.parse is asynchronous, so all your code for data manipulation should be wrapped in a callback function (accessor argument in the documentation). The basic code should be structured as follows:

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
});

这是一个工作的小提琴.

这篇关于如何加载要与D3一起使用的tsv文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！