D3: Heat Map Data Visualization Project- User Stories 10 and 12

#1

Hello, and thank you in advance for any help.

I am working on the project to Visualize Data with a Heat Map.
Here is the code: codepen .io/lucassorenson /pen/wOrwgp?editors=0010

I am having trouble passing tests #10 and #12

10. My heat map should have cells that align with the corresponding year on the x-axis.

Error: year values don’t line up with x locations : expected false to be true

12. My heat map should have multiple tick labels on the x-axis with the years between 1753 and 2015.

Error: X axis labels should contain a year that’s at least 1753 : expected ‘1,760’ to be at least 1753

It seems like the 2 problems are related, and solving one will solve the other. Any help is greatly appreciated.

#2

I figured it out. They wanted me to use Dates for the xScale instead of numbers. Also, I had to pass in the month as 0 for all of them. So:

xScale = scaleTime()
  .domain([d3.min(new Date(d.year, *0*))])

.append('rect')
...
.attr('x', (d) => new Date(d.year, *0*))

I feel silly. Hopefully somebody else sees this and saves themself some time.

#3