Js-Treemap

Demonstration TreeMap Back

TreeMapping is an ingenious means of visualising hierarchic values. Often used to answer the question "Where has all my disk space gone?" it lends itself naturally to many data models, even if the hierarchy is artificial.

jsTreemap does all this in plain old JavaScript and HTML DIV elements. The treemap control can be fully interactive and allows the user zoom in and out.

The Treemap can also make use of an adapter object to fit existing (and sometimes large) data models, in an XML DOM for example.

Examples

A simple demo, using a simple TreeNode model A more complex demo, loading its data model from an XML document and using a data adaptor. NB: this can take a few seconds to get started, depending on your CPU, so be a little patient.

Platforms

While not exhaustive by any means, the following platforms have all run Js-Treemap sucessfully

Firefox v2.0

Internet Explorer v6.0

Safari v3.1 on Mac OS X

Opera on Nintendo Wii

Downloads

JS-Treemap has no dependencies, and packs down to 7K of JavaScript (from 31K). The most current distribution can be downloaded from here.

See Also

jsviz is a very impressive JavaScript library, useful for visualising trees, object relationships and DAGs

Author

Martin Cowie.