I recently had to create an interactive tree diagram displaying companies and their subsidiaries and the business requirements specified something "prettier" than I could achieve by styling a nested HTML list. Additionally I had to support Internet Explorer 8, which does not have Canvas or SVG support. Pondering the problem I remembered hearing on The Changelog of a client-side drawing library called Raphaël. Raphaël provides an abstraction over SVG on browsers that support it and on IE does the same thing using VML and thus giving me the ability to draw pictures in the browser going all the way back to IE 6.
So armed with the ability to draw I created my tree. Most of the new client-side code that I am writing today is in CoffeeScript so that is what I used here. The following is my main drawing routine:
And then some code to create some sample data and call it:
See it in action here
I'll post the zipped code shortly.