You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
When a chart's data is entirely null/empty for a window (a real product case for analytics dashboards: a metric tile that's "quiet" for an interval), YAxis renders no ticks even when both domain and ticks are explicitly supplied. This breaks the "consistent frame" pattern dashboards rely on: each tile renders identical chrome (axes, gridlines, tick ladder) whether it has data or not, so the eye can scan a grid of tiles in one pass.
Today, when one tile in a 6-tile grid is empty, that tile collapses into a different visual (axis line only, no ladder) and the eye has to re-parse "loading vs broken vs empty" every time. You pay that cognitive cost continuously for the lifetime of the product.
Repro: pass data where every value for the YAxis-bound dataKey is null. Set explicit domain={[0, 100]}, ticks={[0, 25, 50, 75, 100]}, allowDataOverflow={true}. Result: the <g class="recharts-yAxis"> is in the DOM but contains zero tick-label children. v2 used to emit the ladder from domain alone.
(Tested on v3.8.1. PR #4433 / issue #4426 restored the axis line for the empty case but explicitly left tick rendering tied to data — this request is the missing half.)
Describe the solution you'd like
When YAxis has all of:
type="number"
explicit domain (e.g. [0, 100])
explicit ticks (or tickCount)
allowDataOverflow={true} (opt-in signal that the user really means "use my domain, ignore data")
…compute the scale from domain alone and render the ticks from the ticks prop, independent of whether any data point is numeric. That treats domain+ticks+allowDataOverflow as an explicit "scale spec independent of data," which is the missing primitive today.
This would let dashboards drop the workaround of injecting a hidden synthetic numeric series (<Line dataKey="__anchor" stroke="transparent" /> with __anchor values ramping 0→100) just to satisfy the scale calculator.
Describe alternatives you've considered
Hidden anchor series (what we ship today): inject a synthetic dataKey with numeric values, render a transparent Line bound to it. Works, but leaks: the series appears in the tooltip payload, the synthetic key appears in legend lookups, and any reducer/scale-derivation code that walks the data has to know to skip __anchor. Each leak is its own bug.
tickCount + domain alone: doesn't work. Without data the scale never resolves, so neither computed ticks nor explicit ticks render.
Copy-paste the axis SVG group into a sibling component with hide={true} on the chart's YAxis (Olio Apps blog). Heavy-handed and brittle — doubles the rendering work and requires keeping the two trees in sync.
The mental model shift: today, recharts treats data as the source of truth and domain as a clamp. For dashboard analytics, domain should be allowed to be the source of truth, with data filling in within that frame. The allowDataOverflow prop already hints at this direction — extending it to "permit a fully-empty data set when domain is explicit" would close the gap without a new API.
Is your feature request related to a problem?
When a chart's data is entirely null/empty for a window (a real product case for analytics dashboards: a metric tile that's "quiet" for an interval), YAxis renders no ticks even when both
domainandticksare explicitly supplied. This breaks the "consistent frame" pattern dashboards rely on: each tile renders identical chrome (axes, gridlines, tick ladder) whether it has data or not, so the eye can scan a grid of tiles in one pass.Today, when one tile in a 6-tile grid is empty, that tile collapses into a different visual (axis line only, no ladder) and the eye has to re-parse "loading vs broken vs empty" every time. You pay that cognitive cost continuously for the lifetime of the product.
Repro: pass
datawhere every value for the YAxis-bound dataKey isnull. Set explicitdomain={[0, 100]},ticks={[0, 25, 50, 75, 100]},allowDataOverflow={true}. Result: the<g class="recharts-yAxis">is in the DOM but contains zero tick-label children. v2 used to emit the ladder fromdomainalone.(Tested on v3.8.1. PR #4433 / issue #4426 restored the axis line for the empty case but explicitly left tick rendering tied to data — this request is the missing half.)
Describe the solution you'd like
When
YAxishas all of:type="number"domain(e.g.[0, 100])ticks(ortickCount)allowDataOverflow={true}(opt-in signal that the user really means "use my domain, ignore data")…compute the scale from
domainalone and render the ticks from theticksprop, independent of whether any data point is numeric. That treatsdomain+ticks+allowDataOverflowas an explicit "scale spec independent of data," which is the missing primitive today.This would let dashboards drop the workaround of injecting a hidden synthetic numeric series (
<Line dataKey="__anchor" stroke="transparent" />with__anchorvalues ramping 0→100) just to satisfy the scale calculator.Describe alternatives you've considered
Hidden anchor series (what we ship today): inject a synthetic dataKey with numeric values, render a transparent Line bound to it. Works, but leaks: the series appears in the tooltip payload, the synthetic key appears in legend lookups, and any reducer/scale-derivation code that walks the data has to know to skip
__anchor. Each leak is its own bug.Conditional fallback UI: don't render the chart at all when empty; render a placeholder div with the empty-state copy. Maintainer-recommended in Empty Chart Display Possible? #345/Displaying placeholders when no data is available #430/Improvement: support a
loaderslot that could contain a chart skeleton or text #1707. But it breaks visual consistency — empty tiles now look fundamentally different from populated ones in a grid.tickCount+domainalone: doesn't work. Without data the scale never resolves, so neither computed ticks nor explicitticksrender.Copy-paste the axis SVG group into a sibling component with
hide={true}on the chart's YAxis (Olio Apps blog). Heavy-handed and brittle — doubles the rendering work and requires keeping the two trees in sync.Additional context
Related history:
loaderslot that could contain a chart skeleton or text #1707 — Empty-state placeholder discussionsThe mental model shift: today, recharts treats
dataas the source of truth anddomainas a clamp. For dashboard analytics,domainshould be allowed to be the source of truth, with data filling in within that frame. TheallowDataOverflowprop already hints at this direction — extending it to "permit a fully-empty data set when domain is explicit" would close the gap without a new API.