Repeating sorting animation
A shuffled array of 100 bars repeatedly animates through a sort-and-reset cycle, showing each value sliding horizontally to its sorted position before the array reshuffles and restarts. Two rows of SVG rectangles represent the original and sorted states, with fill opacity encoding each bar's numeric value. The animation uses d3.v3 transitions with staggered timeouts, ordinal scales for positioning, and duration-based easing sequences to coordinate the sorting, return, and shuffle phases.
AI-generated descriptionThis is an offshoot of a project where I was playing around with animating a merge sort. I started messing with transitions and timeouts and it kinda turned into its own thing.
A lot of this was built around <a href='http://bl.ocks.org/mbostock/'>mbostock</a>'s block: <a href='http://bl.ocks.org/mbostock/39566aca95eb03ddd526'>Mergesort I</a>.