Skip to content Skip to sidebar Skip to footer

Why Are The Labels On My D3 Axis Inconsistent (e.g. Month, Day)?

I'm trying to create a D3 X axis that has a time scale. The x axis labels are appearing inconsistently: Sat 09 Aug 10 Mon 11 Tue 12 Wed 13 Thu 14 Fri 15 Sat 16 Aug 17 I've put my

Solution 1:

You had a good time format written, but you need to tell your xAxis to use it:

var xAxis = d3.svg.axis()
    .scale(x)
    .tickSize(1)
    .tickFormat(format) // <------ add this line
    .orient("bottom");

Here's what the axis will change to. (Note that you might need to tweak how you draw the axis due to size constraints.)

updated axis

Post a Comment for "Why Are The Labels On My D3 Axis Inconsistent (e.g. Month, Day)?"