Bar Chart X Axis labels not appearing

I’m working on the Bar Chart project for the Data viz certification, and I’m running into some trouble getting the xAxis labels to appear. Relevant code is as follows:

 const xAxisGenerator = d3.axisBottom().scale(xScale).ticks(14);
   const xAxis = bounds
     .attr('id', 'x-axis')
     .style('transform', `translateY(${dimensions.boundedHeight}px)`);

   const xAxisLabel = xAxis
     .attr('x', dimensions.boundedWidth / 2)
     .attr('y', dimensions.margin.bottom - 10)
     .attr('fill', 'black')
     .style('font-size', '1.4em');

I’m using the same approach for the scatterplot chart, and it’s working just fine there, so I’m not sure what the problem is. Full code is at:

Hi @dylanesque. I have noticed the date you are parsing is in the format YYYY-MM-DD. Try replacing the code below:

const dateParser = d3.timeParse('%Y')


const dateParser = d3.timeParse('%Y-%m-%d');

Take note I was running your code using version 6.1.1, while you are on version 5 but I believe there won’t be any difference.

Yes, I figured this out last night! For anybody else that encounters this issue, time formatting is very strict and has to be exact:

1 Like