Date format in D3.js

Question

I have a column (date) in csv which stores the date in "2003-02-01"(y-m-d). I would like to format the date in month and year like Apr 2003. how do i do that? ``` var format = d3.time.format("%m-%Y"); data.forEach(function(d,i) { d.date = format(d.date); }); ``` I am getting the following error Error: `TypeError: n.getFullYear is not a function Line: 5` the csv file contains values: ``` 200,300,400,288,123,2003-01-01 300,700,600,388,500,2003-02-01 ``` what is the issue here?

Accepted Answer

Javascript doesn't automatically recognize the values in the CSV file as dates, just reading them in as strings. d3's time functions make it pretty easy to convert them to datetime objects:

```
> parseDate = d3.time.format("%Y-%m-%d").parse
> parseDate('2003-01-01')
Wed Jan 01 2003 00:00:00 GMT-0600 (Central Standard Time)
```

To format the dates like you want, we need to go the other way, from a date object to a string:

```
> formatDate = d3.time.format("%b-%Y")
> formatDate(parseDate('2003-01-01'))
"Jan-2003"
```

I would recommend representing your dates within your program with date objects and only formatting them as strings when you need to display them.

Date format in D3.js

Solution

Problem