All content wraps correctly - without disturbing the tree display;
Trees are presented using a familiar interface - one
immediately familiar to any users who have ever browsed
through the directory structure of their machine's filing
system;
The tree viewer is available as a stand-alone component;
Information about which branches of the tree are visible
persists even if the page is left and returned to later.
Tree editor
The tree editor application allows users to create and
manipulate hierarchical trees using an ordinary web browser;
The tree is rendered using the tree viewer component while
it is being edited - providing a degree of "WYSIWYG" editing;
Several sorts of operation are permitted to be performed on the tree:
Single node-oriented operations:
...allow single "leaves" to be created, manipulated, modified or deleted;
Branch-oriented operations:
...allow branches of the tree to be pruned - or grafted to other locations in the tree;
Mass-node operations:
...these allow large numbers of nodes to be manipulated at once.
Branches of the tree can be treated as though they were independent roots;
Applications
Many structures naturally form hierarchical trees:
Threaded discussions:
...often posts are made in response to other posts - and a
natural way of rendering the results is a hierarchical tree;
Human family trees:
Here a tree is a natural way of following blood lines;
Nested lists:
In cases where lists can contain other lists, a natural
representaion is a hierarchical tree;
Taxonomical diagrams in biology:
Biological taxonomies are family trees on a grand scale;
Addresses, domains, file paths:
The need to specify addresses as strings often results in
them being arranged into a hierarchical tree;
XML/HTML documents
A number of common document formats are structured into elements
which naturally form nested hierarchical trees.
Collapsible trees also have many applications:
Collapsible trees can hide irrelevant information:
Information such as footnotes or references is often best kept out
of the way of the casual reader. A collapsible tree can hide this
information - while still keeping it only a click away;
Collapsible trees can act as summaries:
A collapsible tree can present a summary initially - while
still allowing readers to "drill down" on the points that
interest them - without swamping them initially with lots of
irrelevant details.
More examples should be available soon on our page of sample applications.
This application allows the contents of a directory on the
server to be navigated. The tree viewer component is again
used to display the directory structure.
Other sample sites
There are a variety of sites using the tree component.
A list of sample sites is available on the page devoted to the
tree viewer.
Source code
Source code for the tree viewer tree editor and is available here.
License
Everything on this web site has been placed into the public domain by its author.
Development
This program is under active development - and you're welcome to join in.
More details...
The license terms of the code maximise the ease of reusing
this code in other projects.
If you use the code, you are warmly invited to contribute
any constructive changes you make back to the project.
That way others benefit, the project benefits - and you are
likely to benefit as a user of it.