6 ms·

Interactive Algorithm Visualizer

144 points by nimitkalra 10y ago

rmason 10y ago
This tool reminds me of the work of Bret Victor who challenged developers to build visualization tools for code: https://vimeo.com/36579366 https://vimeo.com/36579366
westoncb 10y ago
Interesting. I've been working on an interactive 3D algorithm/data structure visualizer (http://tiledtext.com/projects/avd http://tiledtext.com/projects/avd), but was thinking of it more as a debugging tool than an educational aid. I like the catalog aspect here: would be nice to have one of these for every wikipedia algorithm page.
wnesensohn 10y ago
The visualizer is really nice, the examples could use some work though. Selection Sort, for example, makes the algorithm look extremely (impossibly) good at first glance - O(n) - because it's not showing the majority of the steps. Instead of for (var j = i + 1; j < D.length; j++) { if (D[j] < D[minJ]) { tracer._select(j); minJ = j; tracer._deselect(j); } } it has to be for (var j = i + 1; j < D.length; j++) { tracer._select(j); if (D[j] < D[minJ]) { minJ = j; } tracer._deselect(j); } Bubble Sort has the same problem, as do Quicksort and Mergesort. Normally I wouldn't mind, but these examples are intended for beginners, and it might give them a false sense of time complexity for these basic algorithms.
- voltagex_ 10y ago
  Raise an issue in case the author isn't reading here. https://github.com/parkjs814/AlgorithmVisualizer/issues https://github.com/parkjs814/AlgorithmVisualizer/issues
Capira 10y ago
Great work! Reminds me of http://visualgo.net/ http://visualgo.net/
- mynameisbahaa 10y ago
  Thank you for mentioning this.
bkokoszka 10y ago
Really nicely done! The animations though would be more enlightening if you exposed more of the algorithm state in them, e.g. by showing how the queue grows and shrinks in the BFS visualization.
jazzido 10y ago
Also see Walnut.io: https://thewalnut.io/app/release/34 https://thewalnut.io/app/release/34
ckib16 10y ago
Fantastic tool! I wish more code visualization tools like these were available. Great job.

144 points by nimitkalra 10y ago

This tool reminds me of the work of Bret Victor who challenged developers to build visualization tools for code: https://vimeo.com/36579366 https://vimeo.com/36579366

westoncb 10y ago

Interesting. I've been working on an interactive 3D algorithm/data structure visualizer (http://tiledtext.com/projects/avd http://tiledtext.com/projects/avd), but was thinking of it more as a debugging tool than an educational aid. I like the catalog aspect here: would be nice to have one of these for every wikipedia algorithm page.

wnesensohn 10y ago

The visualizer is really nice, the examples could use some work though. Selection Sort, for example, makes the algorithm look extremely (impossibly) good at first glance - O(n) - because it's not showing the majority of the steps. Instead of for (var j = i + 1; j < D.length; j++) { if (D[j] < D[minJ]) { tracer._select(j); minJ = j; tracer._deselect(j); } } it has to be for (var j = i + 1; j < D.length; j++) { tracer._select(j); if (D[j] < D[minJ]) { minJ = j; } tracer._deselect(j); } Bubble Sort has the same problem, as do Quicksort and Mergesort. Normally I wouldn't mind, but these examples are intended for beginners, and it might give them a false sense of time complexity for these basic algorithms.

voltagex_ 10y ago
Raise an issue in case the author isn't reading here. https://github.com/parkjs814/AlgorithmVisualizer/issues https://github.com/parkjs814/AlgorithmVisualizer/issues

Capira 10y ago

Great work! Reminds me of http://visualgo.net/ http://visualgo.net/

mynameisbahaa 10y ago
Thank you for mentioning this.

bkokoszka 10y ago

Really nicely done! The animations though would be more enlightening if you exposed more of the algorithm state in them, e.g. by showing how the queue grows and shrinks in the BFS visualization.

jazzido 10y ago

Also see Walnut.io: https://thewalnut.io/app/release/34 https://thewalnut.io/app/release/34

ckib16 10y ago

Fantastic tool! I wish more code visualization tools like these were available. Great job.