Как я могу гарантировать, что D3 завершит загрузку нескольких CSV до запуска javascript?
Я загружаю CSV из списка других CSV файлов в javascript, используя D3.
Когда я запускаю следующий код, массив сотрудников по-прежнему остается пустым к моменту его получения в коде. Есть ли правильный способ гарантировать, что D3 завершит загрузку данных до продолжения работы javascript?
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(сотрудников) в последней строке?
Ответы
Ответ 1
Вы можете использовать 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)
}
Ответ 2
Ваш код кажется прекрасным. Это просто, что вы регистрируете employees
до того, как данные будут готовы. Но если вы console.log
на последней строке parseList
, вы должны иметь его.