Tree-Maps: A Space-Filling
Approach to the Visualization
of Hierarchical Information
Structures
Brian Johnson
Ben Shneiderman
(HCIL TR 91-06)
Steve Betten
February 14, 2001
Outline of Paper







Introduction
Comparison of methods
Example: directory tree
Treemap method
Algorithms
Coping with size
Future research directions
Introduction


Motivation: large hierarchical data
Methods



Objectives


Spatial versus textual methods
Interactive versus static methods
Efficient space utilization, interactivity,
comprehension, aesthetics
Hierarchical data: structure and content

Treemap emphasis on structure and leaves
Comparison of Methods

Motivating example


Viewing large file system hierarchies
Existing methods


Listings, outlines, tree diagrams
General problems




Navigational difficulty
Hidden content information
Text display of content information
Treemap
Comparison: Existing Methods

Listings (e.g. Unix ls, DOS dir)



Outlines (e.g., Unix du, Windows explorer)



Good: detailed content information
Bad: navigation difficulty with explicit paths or
manual traversal
Good: display of both structure and content
Bad: navigation difficulty; only a few lines of
nodes show at a time
Listing and Outlines

Bad: required display space is linearly proportional
to number of nodes
Comparison: Existing Methods
(Continued)

Tree diagrams

Good


Effectiveness and pleasantness for small hierarchies
Bad

Inefficient space utilization




Connections between nodes
50% of display is background
Only partial success of zooming and panning
Lack of content information in large hierarchies


Cluttering from text
For visual cues, insufficient size of nodes
Comparison: Treemap

Good


Efficient utilization of display area
Implicit display of structure



Overview of entire hierarchy



No need to draw separate internal nodes
More space for leaves and visual content cues
Rapid movement to any node
Preservation of context
Required display space is proportional to square
root of number of nodes
Example: Directory Tree

Problems with existing methods




Outline (Windows explorer): too many lines
Tree diagram (Open Windows File Manager):
wasted space
Venn diagram: wasted space
Treemap (nested and non-nested)


Easy identification of largest files on entire file
system
Easy identification of application, system, text,
picture, and archive files
Treemap Method

Structural information: partitioning


Weight (degree of interest) for each node
Properties




Node overlap only with ancestors or descendents
Node display area proportional to weight
Node weight  sum of children's weights
Structural information


Implicitness via slice-and-dice
Explicitness via additional nesting
Treemap Method (Continued)

Content information




Visual cues: color, texture, blinking
Popup windows that display content
Auditory cues that precede popup windows
User control of properties that
decreases on-screen complexity
Algorithms


Drawing of treemap
Tracking of cursor movement

Interactive display of node details
Coping with Size


Average case analysis: pixels per file
Problem of small nodes not displaying


Possible solutions: magnification, zooming
Insignificance (can usually ignore them)
Future Research Directions

Alternative partitioning methods



Visual cues for numeric and nonnumeric content information
Dynamic views (animation over time)


Top-down
Stock portfolio
Node operations

Zooming, marking, selecting, searching
Favorite Sentence


Beard: “Users are never lost because they
can see the complete information space.”
Expression of primary goal of treemap

Use of 2D graphics and implicit internal nodes



Display of entire hierarchy at once (structure)
Significant visual cues for most nodes (content)
Solution to previous navigation and content
problems
Contributions


Demonstration of application and
effectiveness of treemap
Provision of worthwhile direction for future
research



Alternative partitioning methods
Applications: stock (Smartmoney)
Propagation of treemap concept

Widely cited paper from 1991 IEEE Visualization
conference
Critique

Good





Definition of problem domain
Comparison to existing methods
Concrete and relevant example
Algorithms
Bad

Lack of emphasis on the difficulty of comparing
rectangles with different aspect ratios

Future research
Treemap Developments

Academia







1992: stock portfolio
visualization
1994: decision making
1994: satellite
management
1999: cushion treemap;
squarified treemap
2000: parameterized
rectangles
2000: TreeMap2000
2000: pivot by size; pivot
by position

Industry







DiskMapper
SeeDiff software
code viewer
Storyspace hypertext
authoring system
Tcl/Tk widget
Smartmoney
PeopleMap
Peets Coffee
Link Recommendations

UMD HCIL history of treemap


TreeMap2000


www.cs.umd.edu/hcil/treemaps
www.cs.umd.edu/hcil/treemaps/treemap2000
Demo comparison of five treemap partitioning
algorithms

www.columbia.edu/~mmw111/treemap/
layout.html