2017-03-24 48 views
2

正确加载数据非常困难。这里是标题行与第一内容行:在csv中读取日期解析

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&[email protected],+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);在我的回调函数之后,我得到了undefined。这是什么console.log(数据);版画,这是相当奇怪的看着:

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() } 

和错误代码我目前得到:在d3.parcoords

TypeError: data.slice is not a function 

当调用数据(数据)和

TypeError: e is undefined 

在此行:

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

我是ter在这里发生了什么问题的肋骨混淆。我正在使用d3 v3。

+0

我没有用过D3的CSV解析器(虽然我使用D3否则) 。但是,如果您使用的是版本3,那么您的数据结果看起来就像是完全数组,作为第二个回调,而不是返回结果。您定义的唯一回调函数是访问器。请参阅[文档](https://github.com/d3/d3-3.x-api-reference/blob/master/CSV.md#csv) –

回答

1

由于您使用的是D3 v3.x,因此没有将columns属性添加到数据数组中(请参阅我的答案:https://stackoverflow.com/a/42994150/5768908)。

但是,解决方案很简单。只需更换:

dimensions(data.columns) 

有了:

dimensions(d3.keys(data[0])) 

这里是一个演示:

var data = d3.csv.parse(d3.select("#csv").text()); 
 

 
console.log(d3.keys(data[0]));
pre{ 
 
    display: none; 
 
}
<script src="https://d3js.org/d3.v3.min.js"></script> 
 
<pre id="csv">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&[email protected],+1 (000) 000-0000,+1 (000) 000-0000,2,0,895,895,0</pre>

+1

另外,请记住,在你以前的问题( http://stackoverflow.com/a/42968617/5768908)我明确指出,列是仅在D3 v4中添加的属性。 –

+0

是的,谢谢。不太确定在哪里可以找到v3的替代品。非常感谢,感谢您的帮助和有益的花絮:) –

+0

因此,当我使用console.log(d3.keys(data [0]));声明我的数据变量后,我得到一个空数组。这似乎是parseDate函数的一个问题,但我仍然很难找出需要解决的问题! –