了解nvd3 x轴日期格式 [英] Understanding nvd3 x-axis date format

查看:504
本文介绍了了解nvd3 x轴日期格式的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

如何将日期(x xAxis)格式化为1025409600000?我一直在研究他们的文档,但不能说明这是如何工作,它会使我的生活更容易,如果有人会帮助我理解如何更改为一个正常日期格式,如MMDDYYYY

how is the date (x xAxis) formatted as "1025409600000"? I have been studying their documentation but can not figure how this works, it would make my life easier if someone would help me to understand how to change this to a 'normal' date format, like MMDDYYYY

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

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

感谢

推荐答案

我解释了你的问题,1025409600000如何格式化为MMDDYY,因为这是在NV的例子发生了什么。

I've interpreted your question as how does 1025409600000 get formatted to MMDDYY as that's what's happening in the NV example.

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

In the example you pointed to the x axis has the dates almost in the format you want %m/%d/%Y (or MMDDYY) x axis date is formatted in the following line:

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

所以 d3.time.format('%x')指定从(新日期(d))返回的日期的格式。您指向的文档让我们知道格式是什么,并且%x - 日期,作为%m /%d /%Y em,似乎返回%m /%d /% y 。阅读文档后,我会预期NV代码将返回您之后的格式,但您可以很容易地获得您的格式:

So the d3.time.format('%x') specifies the format of the date that is returned from (new Date(d)). The documentation you pointed at lets us know what the format will be and that is %x - date, as "%m/%d/%Y" which appears to be returning "%m/%d/%y". After reading the documentation I would have expected that the NV code would return the format you're after but you can easily get the format your after with:

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

new Date(d)日期数据并将其转换为javascript日期。 NV示例中的日期数据是自1970年1月1日00:00:00 UTC(Unix时代)起的毫秒数,请参阅此 MDN 页面。您可以通过在控制台输入新日期(1025409600000)来检查此自我。

The new Date(d) takes the date data and converts it to a javascript date. The date data in the NV example is the number of milliseconds since 1 January 1970 00:00:00 UTC (Unix Epoch) -see this MDN page. You can check this your self by typing new Date(1025409600000) at the console.

要让D3识别日期格式,无论是%m /%d /%Y还是任何其他您需要创建时间格式,然后解析您的日期数据。

To get D3 to recognise your date format whether that be %m/%d/%Y or anything else you need to create a time format and then parse your date data. This is covered in the D3 Time Formatting page you provided a link to and I'll just adapt what's there to your example.

创建您需要的时间格式:

Create the time format you need in:

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

并用于解析您的数据:

format.parse(d.Date);

没有你的代码我不能说出这里需要去,但应该很清楚。

Without your code I can't say exactly where this needs to go but it should be pretty clear. You can also try this out at the console.

希望这有助于

这篇关于了解nvd3 x轴日期格式的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆