Bar Animation

Interactive bar animation demo with skip toggle and series/category sliders.

Explore how pop-in animation responds to data shape changes. Use the Skip animation switch to verify reduced-motion behavior and the data-orbital-chart-skip-animation attribute.

  • Validating motion tokens during chart development.
  • Demonstrating skip_animation for users who prefer reduced motion.
  • Tuning perceived performance when series or category counts change dynamically.
  • Open this preview while running the preview host on :3010.
  • Toggle Skip animation and confirm the chart root attribute updates.
  • Adjust series and category sliders to see staggered bar entrance on data changes.
  • Mirror the Switch / Slider control pattern when building your own chart playgrounds.
Animation playground

Live controls adjust series count, category count, and skip animation. Bars re-enter with pop-in motion when data changes unless skip is enabled or reduced motion is active.

Series count
Category count
1k2k3k4k5k10002000200030003000400040005000Q1Q2Q3Q4