D3:将数据转换为数字

D3: Convert data to number

本文关键字：数字 转换 数据 D3      更新时间：2023-09-26

我在D3中有一个条形图，我想在x轴上显示一些日期。我从数据库中得到的是两个字段，我必须将它们连接起来才能得到年和月。见下文。这个想法是，对于d.date字段，我得到NaN，尽管我已将其转换为数字。

data.forEach(function (d) {
    d.date = "20" + d.yy + "/" + d.mm;
    // coerce to number
    d.value = +d.value;
    d.date = +d.date;
    console.log(d.value);
    console.log(d.date);
});
x.domain(data.map(function (d) {
    console.log("HEelllppp!!!!",d.date);
    return d.date;
}));
y.domain([0, d3.max(data, function (d) {
    return d.value;
})]);

有人有什么想法吗?提前感谢!

可以使用一元加号将字符串转换为数字:

console.log(+"12345")
console.log(+true)
console.log(+"17.9876")

但是，您正在尝试将字符串转换为非数字字符，如"2016/02"。它将返回NaN:

console.log(+"2016/01")
console.log(+"1a2b3c")

解决方案:对日期使用序数刻度，将它们作为字符串传递(懒惰的解决方案)，或者使用D3(最好)解析日期:

var dateString = "2016/04";//this is a string
var format = d3.time.format("%Y/%m");
var date = format.parse(dateString);//this is a date
var dateTick = format(date);
console.log("date is: " + date)
console.log("but you can show it as: " + dateTick)
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script>

不应转换为数字，而应转换为日期:

var dates = data.map(function(d){ return new Date(d.yy + "/" + d.mm); })
var xScale = d3.time.scale().domain(d3.extent(dates))

如果我使用var data = [ { yy: 2016, mm: 01}, {yy: 2016, mm: 02 }];，我从d3.min(xScale.domain())中得到以下内容:

Mon Feb 01 2016 00:00:00 GMT-0500 (EST)
相关文章：