block by jhellier f9632fad18f1e077d23e

Pick Up Sticks Sort

Full Screen

Built with blockbuilder.org

Randomly generates a bunch of sticks then randomly drops each stick into a pile. There is always one red stick in the pile. Click the “Sort It” button and the sticks are pulled out and placed on the bottom of the frame and then sorted. At this point the red stick should be very clearly seen and comparable. Hitting the reset button will generate a new random pile.

This was based on a sketch I did and then asked could I implement it in D3. This is how a lot of the projects I am doing go. It is a fun way to see what you can do. Also like the tons of examples the D3 community is developing, it provides inspiration to do other things. Clearly this was influenced heavily by other community examples, everything from the co-occurence matrix to the visual sorting algorithms.

An ongoing question for the animation is can we create meaning in the animation itself. Ideas like drawing the user’s attention to specific pieces or creating meaning by the change in proximity to passing or merging objects.

index.html