Symbol
Flux
Do you ever wish you could just see some table or tree (or graph, list or hashmap) while programming?

I want to be able to do that all the time, without having to work for it. So, I'm writing an 'abstract visual debugger' to that end, and this is what it looks like so far:



Note: A lot of the times it just looks like chaos in the video... for some reason I thought it was very important to emphasize that this thing could scale, instead of clearly showing some practical use cases. Ordinarily, you'd probably have, maaybe three data structures that interact with one another that you'd be watching at once. Part of how the auto layout algorithm works is containing each data structure inside of a cube, and then just laying out the cubes. In the video you only see list and hashmap renderings, but I can render graphs and trees inside cubes too, and the layout algorithm works the same. Also, you wouldn't use the camera 'free look' mode that often; mostly you'd be cycling through 'pages' of data structures (pressing left/right), or single data structures within a page (pressing up/down), or letting the 'self-navigating' mode do its work: it keeps track of which changed elements haven't been observed yet, and then moves over and observes 'em.

Where this came from: My favorite debugging technique is to create a dynamic visualization of whichever datastructure(s) I have found to be causing me troubles. I got tired of writing these from scratch each time, and I was thinking about a project that was going to require a bunch of different visualizations, so, this is my effort at a general solution. You can see my use of a sort of 'one off' data structure visualization here (was used for debugging Tiled Text; it's the sideways tree-thing on the right):



I used it to watch the abstract syntax tree as I performed operations on the 'document.' It took probably a good five hours to code, and there were certain things about the nature of it that made it easier than it would be in many cases. With the general purpose data structure visualizer I'm working on now, it would take virtually no time: I would just code the abstract syntax tree on a MonitoredTreeNode instead of a TreeNode.