• Open in:

Drill-Down Treemap

Drill-Down Treemap is a great way to cleanly display high-level information without losing the ability to analyze the underlying details. Try clicking on one of the squares to see the sales of different models of that brand. You can also compare this demo to the multi-level treemap demo where the same data is displayed in full detail from the get-go.

Key implementation details

To make Treemap display only the first level on load we set its initialDepth to 1. In a drill-down chart it is also a good idea to provide a way to get back to a higher level. In this demo we use BreadcrumbBar for the commonly implemented breadcrumb navigation functionality.

Related tutorials

Demo source