Tree map

Definition

Visualisation method for hierarchical data, using geometric inclusion to encode parent-child relationships

• visualizes tree data

• superclass of voronoi tree map

Anatomy

A treemap represents hierarchical data through nested shapes, typically rectangles. The fundamental elements include: The visualization uses a space-filling algorithm that divides the available area proportionally among data points, with parent categories represent by larger shapes containing the shapes corresponding to their subcategories. Color can be used to represent a secondary variable or category. The thickness of border lines can be used to indicate hierarchy levels.

When and how to use a treemap

A well-used treemap can allow both the relative size of categories and their hierarchical organization to be understood simultaneously.

Strengths

• Space efficiency: By definition, treemaps totally fill the available space
• Pattern recognition: A treemap makes it easy to spot the largest contributors and outliers
• Hierarchical context: Preserves context by keeping related items visually grouped

Caveats and limitations

• Shape inconsistency: Rectangle shapes vary widely, making precise comparisons difficult
• Limited precision: Not ideal when exact values need to be compared
• Deep hierarchies: More than 3-4 levels of hierarchy become difficult to interpret
• Small values: Very small values may become nearly invisible or unreadable

Use cases

• File system visualization: Showing disk space usage across folders and files
• Budget allocation: Displaying how resources are distributed across departments and projects
• Product portfolios: Visualizing sales or profits across product categories and subcategories
• Website traffic analysis: Showing page views across site sections and individual pages

Recommendations

• Limit hierarchy to 2-3 levels for clarity
• Use consistent and intuitive color schemes
• Include clear labels for larger rectangles
• Consider interactive versions that allow drilling down into hierarchies
• Provide context or a legend explaining the size and color encoding
• Combine with other visualizations when exact comparisons are needed
• Use algorithms (like “squarified” treemaps) that optimize rectangle shapes toward squares

Variations and related visualizations

• Voronoi treemaps: Use irregular polygons instead of rectangles
• Circular treemaps: Use nested circles instead of rectangles
• Icicle plots: Represent hierarchy with adjacent rectangles rather than nested ones

References

• Shneiderman, B. (1992). Tree visualization with tree-maps: 2-d space-filling approach. ACM Transactions on graphics (TOG), 11(1), 92-99.

Links

Wikidata entity: Q838583

Wikipedia page: Treemapping