的Javascript D3從CSV

好讀書，所以我有點用JavaScript一個小白的，我需要從CSV中讀取數據，以與D3一個條形圖。條形圖對我來說沒有問題，從csv文件讀取的是。這是我的代碼：的Javascript D3從CSV

var dataset; 
    d3.csv("gender_ratio.csv", function(data) { 
    dataset = data; 
    return dataset; 
}); 

var add = function(year, total, males, females){ 
    var year = { 
     year: year, 
     total: total, 
     males: males, 
     females: females 
    }; 
    newdata.push(year); 
    return newdata; 
}; 

for (var i = 0; i < dataset.length; i += 4){ 
    add(dataset[i], dataset[i+1], dataset[i+2], dataset[i+3]); 
    return newdata; 
};

有人能告訴我我在這裏怎麼了？我用modzilla firefox運行這個，所以瀏覽器安全不是這裏的問題。

來源

2015-06-08 Yoeril

呼叫加載CSV數據異步完成。這意味着您的for循環在數據加載之前運行。

如果將for循環進入呼叫到d3.csv回調函數，則數據將可用。

您也應該檢查哪些返回的數據看起來像d3.csv。你的代碼假定它返回一個平面數組，而它實際上返回一個對象數組，其中每個元素表示一行。如果您在函數的回調添加console.log你會得到什麼樣的數據看起來像一個更好的感覺。

你也有一個return聲明for循環，這意味着它只能將退出循環之前處理數據的第一要素。

d3.csv("gender_ratio.csv", function(data) { 
    dataset = data; 
    // process data here 
    console.log(data); 
});

來源

2015-06-08 09:43:59 knolleary

噢，我現在明白了，非常感謝！ – Yoeril

請參閱我關於數據格式的最新答案 – knolleary

首先，D3的.csv功能的工作原理是異步的，因此你需要調用.csv函數內TE實際柱狀圖繪圖功能。如果csv文件的第一行以列名爲特徵，您可以使用回調函數：

var dataset = []; 
d3.csv("gender_ratio.csv", function(d) { 
    return { 
    year: d.year, 
    total: d.total, 
    males: d.males, 
    females: d.females, 
    }; 
}, function(error, rows) { 
    dataset = rows; 
    drawBarChart(); /* <<-- This would be the call to the drawing function. */ 
});

來源

2015-06-08 09:46:47 Paul

的Javascript D3從CSV

回答

相關問題