Как загрузить 2 столбца csv как массив d3

Question

d3.csv("Sales Export Friendly 2-14-2017.csv", function(data) { 
var sales = data.map(function(d) { return [ +d["BookingID"], +d["Total Paid"] ]; }); 
}); 

var x = d3.scaleBand() 
    .domain(sales.map(function(sale){ return sale.bookingID; })) 
    .range([0, width]) 
    .paddingInner([0.1]) 

var y = d3.scaleLinear() 
    .range([height, 0]) 
    .domain([0, d3.max(sales.map(function(sale){ return sale['Total Paid']; }))]);  

Я хочу, чтобы продажи были массивом, который поможет мне получить мои vars x и y. Я получаю ссылкуError ... Это как-то связано с тем, как я загружаю это, но я просто не могу понять это.

Answer 1

D3.csv является асинхронным. Таким образом, ваш файл csv не загружен (и, следовательно, sales не определен и не имеет свойств) к моменту использования вашей переменной продаж в ваших масштабах.

Самым простым решением этой проблемы является размещение ничего требовать данные в формате CSV в самой функции обратного вызова:

d3.csv("Sales Export Friendly 2-14-2017.csv", function(data) { 
    var sales = data.map(function(d) { return [ +d["BookingID"], +d["Total Paid"] ]; }); 

    var x = d3.scaleBand() 
     .domain(sales.map(function(sale){ return sale.bookingID; })) 
     .range([0, width]) 
     .paddingInner([0.1]) 

    var y = d3.scaleLinear() 
     .range([height, 0]) 
     .domain([0, d3.max(sales.map(function(sale){ return sale['Total Paid']; }))]); 

}); 

Весь CSV будет загружаться, даже если вы используете только две колонки (для каждой из с d3.csv/TSV/JSON). Таким образом, переменная продаж несколько лишняя за пределами удобства.