javascript - 使用日期解析读取 csv

Question

这个问题已经有答案了:

d3.json method doesn't return my data array (1 个回答)

已关闭 4 年前。

很难正确加载我的数据。这是带有第一个内容行的标题行:

BookingID,Type,Status,Unit Booked,Unit Owner,Destination,Booking Date,Checkin,Checkout,Renter - FirstName,Renter - LastName,Renter - EmailAddress,Renter - WorkPhone,Renter - HomePhone,#Adults,#Children,Total Stay,Total Paid,Total Due
15642889,House,Confirmed,GV T3 #2106,,,3/20/2016 7:00:00 PM,3/23/2016 3:00:00 PM,3/28/2016 11:00:00 AM,FirstName,LastName,first&last@gmail.com,+1 (000) 000-0000,+1 (000) 000-0000,2,0,895,895,0

以及根据需要加载和解析我的 csv 的相关行:

var parseDate = d3.time.format("%m/%d/%Y %H:%M:%S %p").parse;
var data = d3.csv("Sales Export Friendly 3-19-17.csv", function(data) {
    return {
        unit: data["Unit Booked"],
        date: parseDate(data["Booking Date"]).getMonth() + 1,
        checkin: parseDate(data["Checkin"]).getMonth() + 1,
        LOS: parseDate(data["Checkout"]).valueOf() - parseDate(data["Checkin"]).valueOf()/(24*60*60*1000),
        total: +data["Total Stay"],
        avgNight: (+data["Total Stay"]) / ((new Date(data["Checkout"]).valueOf() - new Date(data["Checkin"]).valueOf())/(24*60*60*1000))
        };
});

我的想法是，然后我会做这样的事情:

d3.parcoords()("#TopLeft").alpha(0.4)
        .data(data)
        .dimensions(data.columns)

如果我尝试 console.log(data.columns);在我的回调函数之后，我变得未定义。这是 console.log(data);打印出来，看起来很奇怪:

Object { header: Cn/u.header(), mimeType: Cn/u.mimeType(), responseType: Cn/u.responseType(), response: Cn/u.response(), get: Cn/</u[n](), post: Cn/</u[n](), send: Cn/u.send(), abort: Cn/u.abort(), on: M/<(), row: e/o.row() }

以及我当前收到的错误代码:

TypeError: data.slice is not a function

在 d3.parcoords 上调用 data(data) 时并且

TypeError: e is undefined

在这一行:

checkin: parseDate(data["Checkin"]).getMonth() + 1,

我对这里出了什么问题感到非常困惑。我正在使用 d3 v3。

Answer 1

编辑:我错了。回调是按行进行的。然而，在最新版本的 d3 中，数据确实是异步加载的。我在寻找使用此功能的正确方法时遇到了一些困难，但我找到了解决方案。 d3.csv 现在返回一个 promise 。要使用解析后的数据，请将 doSomething 传递给 promise.then()。

原始评论，用于上下文:

The CSV file is loaded asynchronously, so setting data=d3.csv(path,callback) makes little sense. When you declare a callback, that is where things must happen. The callback may refer to a global variable, or just use a local variable and pass the result to the next stage. Judging by your code, you want to output an object that holds filtered/postprocessed columns stored under their respective keys.

Also, I doubt that the time parse method can be applied to an array. To do that, you likely have to use array.map.

I would suggest something like this (not tested):

var parseDate = d3.time.format("%m/%d/%Y %H:%M:%S %p").parse;
d3.csv("Sales Export Friendly 3-19-17.csv", function(data) {
    //Note that data is a local in this function scope
    let filtered_data = {
        unit: data["Unit Booked"],
        date: data["Booking Date"].map(s=>parseDate().getMonth()+1),
        checkin: data["Checkin"].map(s=>parseDate().getMonth()+1),
        total: data["Total Stay"].map(s=>+s),
    };

    filtered_data.LOS = [];
    filtered_data.avgNight = [];
    let N = data["Checkout"].length;
    for (let i=0; i < N; i++) {
        filtered_data.LOS[i] = parseDate(data["Checkout"][i]).valueOf() -parseDate(data["Checkin"][i]).valueOf()/(24*60*60*1000),
        filtered_data.avgNight[i] = (+data["Total Stay"][i])/filtered_data.LOS[i];
    }
    doSomething(filtered_data);
});