Mid align axisX in a plot

I build a gantt timeline using plot in this notebook - Vacation Gantt / hashg | Observable

I’m trying to add 2 plot.axisX to this plot

  1. representing the month
  2. Representing Date & Day of the week.

I’m able to get the Date & Week rendered.

But I’m having challenge representing the month above it. Similar to this representation.

Thanks in advance.

2 Likes

It’s possible, but pretty tricky, to do exactly what you’re describing. You’ll need to do some date math using d3-time to compute the middle of the months, intersected with the domain of your data. I’ve compiled a few techniques that might be relevant for you here:

An easier place to start might be to just label the start of the months with a separate axis or a multi-line tick format.

3 Likes