Visualizations of data structures and algorithms

Try the different visualizations

Note that there is currently only a couple of visualizations:

History

A useful aid to understand complex data structures and algorithms is to see them in action. Back in 2011 David Galles from University of San Francisco developed interactive animations for a variety of data structures and algorithms. (Or rather, he ported his even older implementations to Javascript in 2011). Updated versions of his implementations are available here.

However, the original implemetation uses the HTML Canvas bitmap to draw the animations, which is slow and a bit ugly. Since 2011 both HTML and Javascript has developed quite a lot, so I thought it was time for a full makeover with a completely new codebase. So here it is: the new implementation uses SVG vector graphics and built-in SVG animations. It also makes use of Javascript's asynchronous processes for pausing the animations, which makes it a lot easier to implment nice animations for data structures and algorithms.

Source code

All source code is available at the GitHub repository. Everything is licensed under GPL-3, which means that you are free to use it and modify the code (as long as you publish the changes under the same license).

I use the nice SVG.js library for working with SVG in Javascript. Thanks to the authors for maintaining it!