CODEWITHSUNDEEP
javascriptd3.js
Top-Bot
Top-Bot

Reputation: 892

Error parsing date for X axis

I am trying to parse data from json data in D3.js, here is the problem function.

minDate = new Date(data[0][0]);
    maxDate = new Date(data[274][0]); 

var x = d3.scaleTime()
          .domain([minDate, maxDate])
      .range([0, width]);

Here is the error

Error: <rect> attribute x: Expected length, "NaN"

The CodePen link https://codepen.io/rocket18/pen/qpVeBj

Any help is greatly appreciated!

Upvotes: 0

Views: 116

Answers (2)

Robert Andersson
Robert Andersson

Reputation: 1521

There were just some minor issues, you used d3.timeFormat instead of d3.timeParse, I added d.year = parseDate(d[0]); in the data.forEach and you appended an svg element to a svg element, I changed it to a div instead.

I also used d3.extent in the .domain

Here's the full working code: Plunker

Upvotes: 1

Carlo
Carlo

Reputation: 652

By looking at your code I see that when you create the x scale function that you call x

var x =  d3.scaleTime()
    .domain([minDate, maxDate])
    .range([0, width]);

minDate and maxDate are no more Date object because you did this

minDate = parse(minDate);
maxDate = parse(maxDate);

try defining the x function before.

Upvotes: 1

Related Questions