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

This is the chart: .html

Documentation:

Thanks

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

This is the chart: http://nvd3/ghpages/stackedArea.html

Documentation: https://github./mbostock/d3/wiki/Time-Formatting

Thanks

• javascript
• charts
• d3.js
• nvd3.js

• The example you've linked to shows you how to use a different format. Can you give us a specific example that you're having trouble with? – Lars Kotthoff Commented Oct 18, 2013 at 22:01
• I'm having trouble with understanding how to input data into the chart, I now understand that the data it currently is reading is in Unix Epoch time. I'd rather have this be a human readable format such as MMDDYYYY. Trying to understand what changes I would have to make for the code to read and plot the data in a format that is easy to read/write, (not unix epoch time) – Sina H Commented Oct 21, 2013 at 19:22

1 Answer 1

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

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

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));

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.

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");

And the use that to parse your data:

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.

Hope this helps