Mobile Components – Tree Map

TreeMap is used to represent a large, hierarchical collection of quantitative data. The hierarchical structure is revealed by the nesting level and location of each rectangle, and convenient drill-down capabilities are used to effectively navigate through the hierarchy.

The original motivation for treemaps’ creation was to visualize the contents of hard drives with tens of thousands of files in 5-15 levels of directories.


  • Measure switching: Easily switch among several measures.
  • Color legend: Rectangles are colored to reflect other attributes of the data set.
  • Data detail: By tapping the headers on mobile, the treemap is redrawn, with only the data contained in the header displaying on screen. On the other hand, if a data rectangle is tapped, a detail view of the item is shown.