I have created a hierarchical data set which I use to store a tree of regions. I want users to be able to add new nodes onto the tree, but I am having a hard time thinking of a very user friendly way to allow the user select the parent node they want to add a child to without having to either:
- Scroll through the entire list
- Click to expand all levels of the tree until they find the one they want (there is no limit technically to how deep this tree can go)
- use some clunky combination of drop-down select boxes to choose the appropriate parent node
Here is a sample of my data, the actual data will contain a ton of information about locations worldwide:
Earth
- North America
- - United States of America
- - - Alabama
- - - - Montgomery
- - - - Birmingham
- - - Alaska
- - - - Juneau
- - - - Anchorage
- - - Arizona
- - - - Phoenix
- - - Arkansas
- - - - Little Rock
- - - California
- - - - Sacramento
- - - - Los Angeles
- - - Colorado
- - - - Denver
- - - Connecticut
- - - - Hartford
- - - - Bridgeport
...
- - Canada
- - Mexico
- South America
- - Argentina
- - - Buenos Aires
- - Bolivia
- - - La Paz; Sucre
- - Brazil
- - - Brasilia
- - Chile
- - - Santiago
...
Any Ideas?
Answer
When your hierarchy is so large, there's no way to avoid clunkiness because it's there by design (large data sets are unwieldy). Miller columns with an "add" button on the bottom will be the most elegant solution here. They allow you to have as many hierarchical levels as possible while making selection process simple because they clearly separate the levels. So your interaction will look something like this:
If you have space limitations (either horizontally or vertically) you can add the respective scroll-bars to accommodate for additional nodes (vertical) or levels (horizontal).
No comments:
Post a Comment