Repository navigation
[Feature] motion(): configurable enter start state (scale about the centre, arc seeds for partitions) #214
Description
Version: @tanstack/charts 1.1.0 (57774e1). Split from #193 (comment section D) and #194 (section C) so it can be closed on its own.
A mark cannot choose how its elements enter: generic marks only fade, and sunburst sectors only take their start shape from an ancestor. Both asks are the same API, an enter start state per element.
Generic marks: the only enter is an opacity fade (from #193 D)
When a keyed rect, dot or text gets an enter track, addEnterMotionTrack ends in a single opacity attribute tween from 0 to the target (motion.ts:2596-2635). ChartMotionTiming carries only delay, transition and path (types.ts:872-877), so a mark cannot ask for another shape of enter.
Example: radial gauge notches (areaX/rect marks) that should grow from scale 0 about each notch's own centre, with a per-notch delay. With the built-in tracks the only options are a fade or nothing. The workaround is scoped CSS keyframes keyed on data-ts-key, which depend on renderer-owned DOM and have to be aligned with the motion clock by hand.
Partition marks: enter/exit seeds cannot be supplied (from #194 C)
- Seeds come only from the nearest related ancestor (
motion.ts:2745,motion.ts:2770); with none, the sector only fades. - The docs describe lineage as the only source (
sunburst.md:171-174).
Ask
- Generic marks: an
enteroption onmotion()(or on the mark'smotion) withfrom: { opacity?, scale? }andorigin: 'center' | 'start', applied per element with the existing per-datumdelay. Or a documented per-element enter transform. - Partition marks:
enter: { from(node) }andexit: { to(node) }, returning[startAngle, endAngle, innerRadius, outerRadius].
Read from source, not run.
Activity
tannerlinsley commentedon Oct 16, 2026
Thanks @toomingos. I tested the two parts separately in private prototypes:
These checks ran in Chromium, Firefox and WebKit. This is not shipped support or a proposed public API yet. The mixed partition prototype adds 0.119 decimal kB gzip to full motion versus its entrance-track prerequisite, so it is not within the current budget.
There is also an interaction contract to finish: presentation points carry live centres but not live shape bounds. In the entrance-track prototype, a 20px-radius custom dot with a 1px focus threshold is selectable at its centre during the transition but not 10px from its centre until the transition settles. The same fixture on current main selects the painted dot at that offset, so this is a prerequisite/prototype gap, not a newly confirmed main regression. Returning exits also depend on #233, which is still under review.
Keeping this open. The remaining work is the opt-in capability and typed seed contract, shape-aware interaction during motion, and integration within the bundle budget. No CSS workaround or renderer-owned attribute API has been adopted.