Here is another cool project that I worked on recently... I came up with the prototype application over a weekend nearly a year ago. Then I introduced it to my former employer... Turns out it got picked up in a several projects of theirs, so I got to develop it even further. It is a tool for browsing social and hierarchical data relationships. It has gone through many development cycles to beceome what it is today. Each time, with different feedback from the client. Honestly, it is not nearly as powerful as it originally was, although now it has a much less complex interface. I guess that will be better for the general (less technical) user base.
So here it is:


The interface is pretty simple, you can zoom in & zoom out, reset the state (rearrange the nodes). You can click and drag any node on the canvas. Or, you can click anywhere on the canvas and drag the entire diagram around. If you just do a sngle click on a node, it makes a request to the server and pulls back dynamically generated xml that describes the data relationships. It also tracks the history of the nodes that you have navigated to, so that you can easily trace back your steps.

Launch the Relationship Mapper Demo

Here's how it works:

The root movie clip contains 3 objects... the controls (top left), the history (bottom), and the canvas. Each node is another object that is created within the canvas object. The lines that "connect" each node are created using the drawing API [ canvas.lineTo ( x , y ) ]. Since the nodes are objects that reside inside the canvas, they are rendered on top of the canvas, and they will always appear above the lines that are drawn.

When the application is initialized, and on each click on a node, a request is made back to the server to load a dynamically generated XML document (created with ColdFusion), using the loadXML function. The XML is then parsed, the canvas is cleared, and nodes are created accordingly.

Here's an example of the XML that it pulls back from the server:
getXML.cfm

In older versions, I had this setup so that each node click built onto the existing tree, rather than clearing the canvas, and only drawing the most recently viewed relationships. It was quite cool, you could build out a huge tree of relationships, and I had four different algorightms to rearrange them. Ultimately, this was too complex for the typical users, and I had to pull it out, but here is a screenshot of what it could do: