Question

我有理解d3的问题。我尝试加载一堆.csv文件，同时在左栏中有一个时间戳，在右栏中有一个整数，表示教室中任何时间点的人数（每个教室都有自己的的.csv）。

现在的想法是制作一个饼图，表示在多个教室之间分配的一天的人。例如，65％的教室1，23％的教室2和12％的教室3.

我很难理解我甚至会如何阅读这些内容，显然d3.csv（）解析器中的所有内容都超出了它之外的所有内容，这非常反直觉。我无法访问我从.csv（）方法外部解析的内容，这很奇怪，因为我正在阅读.csv文件，如下所示：

var files = ["Bibliotheek S2.csv","Bibliotheek S8.csv","Euclides S23.csv","Lovelace Ledeganck.csv","Mercator S8.csv","Nadar S8.csv","Ortelius S8.csv","Practicum S2.csv","S12.csv","Thetis INW.csv","Turing S9.csv","Van Straelen S8.csv","Zuse S9.csv"];

dt = {};
files.forEach(function(f){
    d3.csv("lokalen/"+f,function(data){
        dt[f] = data;
    });
});

我将如何继续这个？我绝对迷失在这里。

谢谢，米兰

Answer 1

并不是d3.csv()范围内的所有内容都不可用：d3.csv()是异步的。简而言之，d3.csv()回调中的代码不会执行，直到在下载csv文件之后。但是，d3.csv()之后的代码会立即执行。在您的情况下，如果您在dt循环后立即尝试访问files.forEach，则文件尚未下载。

要解决这个问题，您需要找到一种方法让应用程序的其余部分等到所有文件都下载完毕。例如：

var files = ["Bibliotheek S2.csv","Bibliotheek S8.csv","Euclides S23.csv","Lovelace Ledeganck.csv","Mercator S8.csv","Nadar S8.csv","Ortelius S8.csv","Practicum S2.csv","S12.csv","Thetis INW.csv","Turing S9.csv","Van Straelen S8.csv","Zuse S9.csv"];

files.forEach(function(f){
    d3.csv("lokalen/"+f,function(data){
      dt[f] = data;
      if (d3.keys(dt).length == files.length){
      // Whatever you'd like to do once you load all the data
      console.log(d3.keys(dt)) // For example to check our work 
      }
    });
});

当每个文件完成加载时，if语句将检查所有文件是否已存储在dt中。如果是这样，它适用于所有数据;如果没有，则在下一个文件加载时再次检查时不会采取任何操作。最终文件将执行您要对完整数据集执行的任何操作。

如何加载多个csv文件并使用它们相互混合

1 个答案: