Data on x-axis is one day off (data for May 24 is showing up as May 23, etc etc) (d3, nvd3)

Question

Here's a pen:
http://codepen.io/cheapsteak/pen/MaYaNR

I'm loading the data via d3.select('#chart svg').datum(data)

The data is fetched from NPM's download stats API, and after transformation, ends up being in the format of

{
  key: String
  values: [{x: Date, y: Number}]
}

Data I get from the server:

{
  "node-sass": {
    "downloads": [
      {
        "day": "2015-05-20",
        "downloads": 25307
      }
    ]
  }
}

My transformation function:

function processServerData(json) {
  if (json.downloads && json.package) {
    return {
      key: json.package,
      values: json.downloads.map( entry => { return {x: new Date(entry.day), y: entry.downloads}; })
    };
  } else {
    return _.values(json).map(processServerData);
  }
}

What I'm getting:

What I'm passing in:

{"day":"2015-05-24","downloads":11296}

Could be a time zone issue. [This question](https://stackoverflow.com/questions/16755487/d3-time-axis-in-a-specific-time-zone) may help. — Lars Kotthoff, Sep 03 '15 at 13:34

score 0 · Accepted Answer · answered Sep 06 '15 at 04:43

Was indeed a timezone issue with the input format of "2015-05-24"

given an ISO format such as "2014-03-07" it will assume a time zone of UTC.

Replacing all -s with /s fixed it, so instead of

new Date(entry.day)

do

new Date(entry.day.replace(/\-/g, '/'))

Data on x-axis is one day off (data for May 24 is showing up as May 23, etc etc) (d3, nvd3)

1 Answers1