What
AdvancedChartImpl's xAxisCommonProps charges every non-forced x axis a
minTickGap of 48px (32px under the mobile viewport check). That is a
time-series budget: 48px of mandatory whitespace between labels, on top of
each label's own measured width. On a categorical axis it is the reason a
bar loses its name, and recharts does not need the help — it already refuses to
draw ticks whose measured boxes would overlap.
objectui#7247 (PR #7385) removed this for short
categorical axes by drawing every label at 5 buckets or fewer, a bound derived
so it is safe at the narrowest shipped widget without measuring anything at
runtime. Above that bound the 48px budget is untouched, so a 6-plus bucket
categorical axis still drops labels even where the widget has ample room — a
7-status pipeline at 290px, for instance, has roughly 33px per band and loses
labels anyway.
Why it was not done in that PR
Two reasons, both deliberate:
- The replacement value is a judgement call, not something existing
evidence pins. Recharts' default is 5; the right number for a band axis is
somewhere between "0, let measurement decide" and "enough that labels do not
read as one word", and picking it is a design decision. - It is not measurable in this repo's DOM test environment. happy-dom
reports zero text metrics, so getStringSize returns {width: 0, height: 0}
and recharts' size-based thinning cannot be observed at all — any unit test
asserting a relaxed minTickGap would pass for the wrong reason. Verifying
it needs a real browser pass, which is why it belongs in its own change with
its own before/after counts.
Note also that recharts' collision model for angled labels is the projected
bounding box (getAngledTickWidth to getAngledRectangleWidth), which is
strictly more conservative than the real constraint — rotated labels are
parallel lines, so they collide on perpendicular separation, not projected
width. Any work here should decide deliberately whether to live with that
conservatism or bypass it the way the 5-bucket branch does.
Where
packages/plugin-charts/src/AdvancedChartImpl.tsx, the xAxisCommonProps memo
(the branch above X_AXIS_ALL_LABELS_MAX_BUCKETS).
Note
Found while implementing objectui#7247; filed unassigned for triage rather than
carried into that PR, whose scope was the reported 3-to-5 bucket cases.
Generated by Claude Code
What
AdvancedChartImpl'sxAxisCommonPropscharges every non-forced x axis aminTickGapof 48px (32px under the mobile viewport check). That is atime-series budget: 48px of mandatory whitespace between labels, on top of
each label's own measured width. On a categorical axis it is the reason a
bar loses its name, and recharts does not need the help — it already refuses to
draw ticks whose measured boxes would overlap.
objectui#7247 (PR #7385) removed this for short
categorical axes by drawing every label at 5 buckets or fewer, a bound derived
so it is safe at the narrowest shipped widget without measuring anything at
runtime. Above that bound the 48px budget is untouched, so a 6-plus bucket
categorical axis still drops labels even where the widget has ample room — a
7-status pipeline at 290px, for instance, has roughly 33px per band and loses
labels anyway.
Why it was not done in that PR
Two reasons, both deliberate:
evidence pins. Recharts' default is 5; the right number for a band axis is
somewhere between "0, let measurement decide" and "enough that labels do not
read as one word", and picking it is a design decision.
reports zero text metrics, so
getStringSizereturns{width: 0, height: 0}and recharts' size-based thinning cannot be observed at all — any unit test
asserting a relaxed
minTickGapwould pass for the wrong reason. Verifyingit needs a real browser pass, which is why it belongs in its own change with
its own before/after counts.
Note also that recharts' collision model for angled labels is the projected
bounding box (
getAngledTickWidthtogetAngledRectangleWidth), which isstrictly more conservative than the real constraint — rotated labels are
parallel lines, so they collide on perpendicular separation, not projected
width. Any work here should decide deliberately whether to live with that
conservatism or bypass it the way the 5-bucket branch does.
Where
packages/plugin-charts/src/AdvancedChartImpl.tsx, thexAxisCommonPropsmemo(the branch above
X_AXIS_ALL_LABELS_MAX_BUCKETS).Note
Found while implementing objectui#7247; filed unassigned for triage rather than
carried into that PR, whose scope was the reported 3-to-5 bucket cases.
Generated by Claude Code