Visualizing Algorithms 50
An anonymous reader writes "Many people reading this site probably have a functional understanding of how algorithms work. But whether you know algorithms down to highly mathematical abstractions or simple as a fuzzy series of steps that transform input into output, it can be helpful to visualize what's going on under the hood. That's what Mike Bostock has done in a new article. He walks through algorithms for sampling, shuffling, and maze generation, using beautiful and fascinating visualizations to show how each algorithm works and how it differs from other options.
He says, "I find watching algorithms endlessly fascinating, even mesmerizing. Particularly so when randomness is involved. ... Being able to see what your code is doing can boost productivity. Visualization does not supplant the need for tests, but tests are useful primarily for detecting failure and not explaining it. Visualization can also discover unexpected behavior in your implementation, even when the output looks correct. ...Even if you just want to learn for yourself, visualization can be a great way to gain deep understanding. Teaching is one of the most effective ways of learning, and implementing a visualization is like teaching yourself."
He says, "I find watching algorithms endlessly fascinating, even mesmerizing. Particularly so when randomness is involved. ... Being able to see what your code is doing can boost productivity. Visualization does not supplant the need for tests, but tests are useful primarily for detecting failure and not explaining it. Visualization can also discover unexpected behavior in your implementation, even when the output looks correct. ...Even if you just want to learn for yourself, visualization can be a great way to gain deep understanding. Teaching is one of the most effective ways of learning, and implementing a visualization is like teaching yourself."
Beautiful and fascinating (Score:2)
Wonderful stuff. Reminded me of this site: http://www.informationisbeauti... [informatio...utiful.net] (beautiful ways to view typically boring stuff).
See also: Data Structure Visualizations (Score:3)
More fundamental CS though: http://www.cs.usfca.edu/~galle... [usfca.edu]
Al Gore Rhythms (Score:1)
The cycles of global warming
Re: (Score:2)
What you mean if I turn my head, the scenery changes? How unexpected! Who would ever think focus was important ... or choice?
Re: (Score:2)
It's ironic you post this on this particular article. It highlights how the placement of receptors in your eye effects how you see the world. What makes you think your own in-built bias (apparently culture-jamming) is any less than anyone else?
I drive many other programmer's batty because when they ask me for help the first thing I do is "survey the scene", the code surrounding their point of interest, rather than listen to anything they think or *know* about what is happening. Once I have my bearings, a
Re: (Score:2)
A group I was working with had this strange phenomenon where their windowed machine learning algorithm would just crap out on certain training sets.
A few weeks later, I was presenting my results and casually mention that, hey, the dataset i got is just outright missing 20% of the data, but there's still enough to illustrate the results, next slide. One of the leads asks, "wait. why didn't anyone notice this?"
I had assumed that it was just my dataset. Nope, turns out that the data just wasn't there at all (t
The book is always better than the movie (Score:2)
I'm sure this is fun cool stuff to play with but... I'm pretty sure my imagination is still better than what a computer screen can show me. "Playing computer" is one of the first practices most new programmers learn, and if you're good at it, it is one of the most powerful tools in your arsenal.
Here's hoping "kids these days" don't skip out on the importance of programmer's imagination over these new fangled tools.
Re: (Score:2)
Here's hoping "kids these days" don't skip out on the importance of programmer's imagination over these new fangled tools.
Here's hoping they do. Us old farts need all the advantages we can get.
Re: (Score:3)
Actually, after reading the article, I'd call what he's doing extremely good basic engineering and model design/view. It's very cool for the problems he presents, but looks like a ton of work. To be generally useful, it seems he'd have to come up with rules of thumb and generalizations for what it is typically important to see/understand in a given algorithm and a way to identify *what* to model/visualize that isn't completely subjective.
He appears to make some great subjective decisions on what/how to do
Re: (Score:2)
I encountered this firsthand when I spent a couple of days trying to write a simple algorithm to detect clipping on an oscilloscope output. We had a secondary
Re: (Score:2)
> Once you get familiar with the tools to make these kinds of visualizations, it can become very straightforward to develop one for your specific use case.
That's the thing, we need a Visualization for Understanding 101 class in comp-sci or something similar.
I guess I had scientific modeling in physics as part of EE but over half the focus was on how to gather/deal with the physicalities of real-world data, which isn't so important when you're modeling something which lives inside a computer to begin with
Re: (Score:2)
Note: I thought it was obvious reading digital output as analog (or merely hooking together input to output on two sensitive instruments) is always going to cause a lot of artifacts and distortion. You don't chain 2 microscopes together and expect to get twice the magnification with no problems...
Maybe my description wasn't clear. These were two oscilloscopes, reading from the same source in parallel. One scope was looking at a high resolution, set to trigger on anything above noise, but with something like a 1V maximum amplitude (hence clipping at 1V). The second was set to trigger at anything over 1V, and had a much larger view window, so there was no data lost to clipping.
The motivation here was to get detail data while simultaneously making sure to capture the full amplitude of big signals. N
Visualize (Score:3)
I debug most of my code this way also. When I'm internally visualizing stuff, I lose track of what's going on around me. I wouldn't be surprised if a brainscan would show activity in my visual cortex.
Re: (Score:2, Interesting)
First the light is, and then I see the yarns and the strings that link them. Then the strings start vibrating and I can hear them talk to each other. Then I hear the races in the polyphony and I reach my arms out to the strings. I sip from the source and smell the algorithms. It is only then that the notes come to my fingers.
Re: (Score:2)
Doesn't everyone program this way?
No, actually ;-)
There seem to be at least a couple of distinct ways of "sensing" the code you're working on. (And I'm not even counting the poor schmucks who are never really able to understand what they're doing.)
Re: (Score:2)
I can't speak for anyone else, but I'm definitely this way. When I get to work in the morning I return to the massive subjective machano-city in my head where the repository lives and plug it in to the objective reality that is Mercurial. Much of bug-fixing is ferreting out the differences between the two. Reading code is removing the fog of the unknown in my head and writing is creating new streets, buildings, and even neighborhoods. (Well... You could hardly call it something so terrestrial, more like
Re: (Score:2)
Assuming I'm taking this the correct way, I find there to also be a "fog" of the sort when I work with stuff. I would describe my visualization as a "living" yet static picture. Different "parts" of the picture interact with other near-by parts, yet nothing actually
Re: (Score:2)
Re: (Score:2)
Anyhow, for me, the "picture" exists, but it's more tactile than visual. There are visual aspects, but it's not how I process most of the information. Loops are spinning wheels when they don't have a clear exit condition, and feel like unrolled spirals when the
Re: (Score:2)
when the animations end, the resulting mazes are difficult to distinguish from each other. The animations are useful for showing how the algorithm works, but fail to reveal the resulting tree structure.
Sure, I visualise how algorithms work, otherwise I can't code them. But the difference in maze generators struck me. Because, as quoted, they're difficult to distinguish from each other.
Other things, such as sorting algorithms, are fairly obvious though... but still nice to see, again.
Re: (Score:2)
Sure... (Score:2)
Many people reading this site probably have a functional understanding of how algorithms work.
Humorist.
Re: (Score:3)
This is total nonsense.
Algorithms are first _designed_ BY humans. Algorithms can be _optimized_ FOR computers.
Visualization is a way to augment understanding, not replace it.
There are 4 primary ways of learning:
* visual,
* auditory,
* kinesthetic, and
* mental.
Students have various ways that work "best" FOR THEM. Saying visualization is dangerous shows your ignorance about the subject. If you had seen the excellent move Temple Grandin you would understand that not everyone thinks the same way. [imdb.com]
Re: (Score:2)
Hmm... Get much performance out of your systems that way? Procedural methods have a time and place, and have given us most of what we have now. Functional methods have given us... A pale, slow, anemic cousin of what procedural has done? (that can't fail in-theory, much like the titanic...)
Honestly, garbage collection did way more for the industry than any other sea-change... Here, was some scut work we could freely let the computer do completely for us. (At least when any kind of hard time-keeping does
15 Sorting Algorithms in 6 Minutes (Score:2, Interesting)
https://www.youtube.com/watch?v=kPRA0W1kECg
Re: (Score:2)
Hungarian bubble sort [youtube.com]
A great book for learing D3.js (Score:3)
I'm not affiliated with the author in any way, but I did buy the book (though you can get it for free).
This is an amazing resource for someone new to D3.js [d3js.org]'s declarative javascript and helps you put it all together: https://leanpub.com/D3-Tips-an... [leanpub.com]
After using D3.js, I've come to the conclusion Mike Bostock is awesome! But it doesn't stop there, people have expanded it like Crossfilter [github.io] and dc.js [github.io].
Tech that allows a javascript n00b like myself to build a simple race results visualization [nullchar.net].
Comment removed (Score:3)
This is fundamental (Score:2)
in explaining how things really are.
Light is a continuous signal. It must be sampled at an interval to be determined and interpreted. It actually flows like a river. Amazing.
Re: (Score:2)
Like many things in physics, it's really a discrete signal at a rate so high as to be continuous for all practical purposes. If you could get your sampling rate ridiculous enough, you'll start to detect individual photons.
Re: (Score:2)
Some place, like MIT or something, was playing with a 1 trillion FPS camera, and by processing the individual photons, they could see around corners to a certain degree. They could use non-polished surfaces like a minor.
Nice work, but done many times before. (Score:1)
Using a bunch of sample points to represent a function is fundamental to computational physics. Stress Analysis, Colorful oops Computational Fluid Dynamics, Computational Electro Magnetics etc etc. Solution adaptive meshing is
Re: (Score:1)
There's no claim to novelty for any of the algorithms. If you scroll down you'll also see imagery of quicksort: stop the presses, this was invented in 1960. The point is the graphical presentation of existing algorithms. This is all made very clear in the prose, and in the summary, and in the title. So well done Captain Blowhard, top marks for your knowledge of a somewhat related domain (although what you're talking about really has fuck all to do with Poisson-disc distributions) but minus several milli
Visualization for evaluating randomness (Score:3)
Visualization is also great for evaluating randomness; remember the images of broken RNG implementations a few years ago? http://lcamtuf.coredump.cx/new... [coredump.cx]