15

D3を使用して、他のCSVファイルのリストのCSVをjavascriptにロードしています。

次のコードを実行すると、従業員配列は、コード内で取得するまではまだ空です。JavaScriptが続行する前にD3がデータのロードを終了することを確実にする正しい方法はありますか?

var employees = [];

//Retrieve the file list of all the csvs in the data directory, then run a callback on them
function retrieveList(url,callback) {
    d3.csv(url,function(data) {
        callback(data);
    })
}

//Parse a file list, and then update the employee array with the data within
function parseList(filenames){
    filenames.forEach(function(d) {
        d3.csv(d.filename,function(data) {
            data.forEach(function(d) employees.push(d.name));
        }
    }
}

//Run this code
var filenamesUrl = "http://.../filenames.csv"
retrieveList(filenamesUrl, parseList);

console.log(employees); //This logs "[]"

ページを Chrome にロードすると、コンソールに移動して従業員のログを記録すると、名前で満たされた配列が返されます。最後の行で console.log(employees) を実行するまでに、どうすればそれを実現できますか?

4

2 に答える 2

21

queue.jsを使用して、すべての d3.csv 呼び出しから結果を収集できます。

function parseList(filenames){
  var q = queue();
  filenames.forEach(function(d) {
    //add your csv call to the queue
    q.defer(function(callback) {
      d3.csv(d.filename,function(res) { callback(null, res) });
    });
  });

  q.await(restOfCode)
}    

function restOfCode(err, results) {
  //results is an array of each of your csv results
  console.log(results)
}
于 2012-11-20T18:17:07.367 に答える
0

あなたのコードは問題ないようです。employeesデータの準備が整う前にログを記録しているだけです。しかしconsole.log、最後の行にあるparseList場合は、それが必要です。

于 2012-11-17T04:16:50.860 に答える