Works well on small screens but at larger viewports sometimes you get this:
width 1320.3692626953125 - tickWidth 100 = tickCount 13 but xAxis.scale(13) returns an array of 21 ticks. Yet xAxis.scale(12) returns an array of7`. Huh?
d3 docs say:
The specified count is only a hint; the scale may return more or fewer values depending on the domain.
and
Each value is a power of ten multiplied by 1, 2 or 5
I don't feel like that explains 13 turning into 21 though.
We could either stop using xScale.ticks() and instead pick out evenly spaced items from xScale.domain(), or keep using ticks and, if its length exceeds expected length, pick out its evenly spaced items. Ticks is nice because we could pick them by date type (http://devdocs.io/d3~4/d3-scale#time_ticks).
Works well on small screens but at larger viewports sometimes you get this:
width 1320.3692626953125 - tickWidth 100 = tickCount 13butxAxis.scale(13)returns an array of21ticks. YetxAxis.scale(12) returns an array of7`. Huh?d3 docs say:
and
I don't feel like that explains 13 turning into 21 though.
We could either stop using
xScale.ticks()and instead pick out evenly spaced items fromxScale.domain(), or keep using ticks and, if its length exceeds expected length, pick out its evenly spaced items. Ticks is nice because we could pick them by date type (http://devdocs.io/d3~4/d3-scale#time_ticks).