javascript – 了解nvd3 x轴日期格式

前端之家收集整理的这篇文章主要介绍了javascript – 了解nvd3 x轴日期格式前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
日期(x xAxis)如何格式化为“1025409600000”?我一直在研究他们的文档,但无法确定如何运作,如果有人帮助我了解如何将其更改为“正常”的日期格式,将使我的生活更轻松,如MMDDYYYY

这是图表:
http://nvd3.org/ghpages/stackedArea.html

文档:
https://github.com/mbostock/d3/wiki/Time-Formatting

谢谢

解决方法

我已经解释了你的问题,1025409600000如何格式化为MMDDYY,就像在NV示例中发生了什么.

在示例中,您指向x轴的日期几乎是您想要的格式%m /%d /%Y(或MMDDYY)x轴日期格式如下:

chart.xAxis
     .tickFormat(function(d) { return d3.time.format('%x')(new Date(d)) });

所以d3.time.format(‘%x’)指定从(new Date(d))返回的日期的格式.您指出的文档可以让我们知道格式将是什么,那就是%x – date,因为“%m /%d /%Y”似乎是返回“%m /%d /%y”.阅读文档后,我预计NV代码将返回您以后的格式,但您可以轻松获取以下格式:

d3.time.format('%m/%d/%Y')(new Date(d));

新的Date(d)将采用日期数据并将其转换为JavaScript日期. NV示例中的日期数据是1970年1月1日00:00:00 UTC(Unix Epoch)之后的毫秒数 – 见此MDN页.您可以通过在控制台输入新的日期(1025409600000)来检查这个自己.

要让D3识别您的日期格式,无论是%m /%d /%Y还是您需要创建时间格式,然后解析日期数据.这在D3时间格式化页面中提供了一个链接,我将只是适应你的例子.

创建您需要的时间格式:

var format = d3.time.format("%m/%d/%Y");

并用它来解析你的数据:

format.parse(d.Date);

没有你的代码,我不能确切地说,这需要去,但应该是很清楚.你也可以在控制台上试试看.

希望这可以帮助

猜你在找的JavaScript相关文章