amCharts Blog

DataViz Tip #27: Chart Types: Treemap

Treemaps are a great data visualization tool to represent data items as part of a whole. Items in a treemap are represented as rectangles proportionally to their value and fill up the entire chart area. This lets viewers perceive their relative size much better than with slices in a pie chart and it also lends itself to displaying more data items at once than you can reasonably fit in a pie chart. Especially when combined with interactivity features.

See the Pen amCharts V4: Changing tree map data by amCharts (@amcharts) on CodePen.24419

Multiple levels of data can be displayed in a treemap at once to show a deeper picture at a glance:

See the Pen amCharts V4: Tree map with two levels visible by amCharts (@amcharts) on CodePen.24419

Alternatively drill-down functionality can be implemented to declutter the view and help viewers focus on one level at a time:

See the Pen amCharts V4: Drill-down tree map by amCharts (@amcharts) on CodePen.24419

Try clicking on any of the tiles in the demo above to go a level deeper. Click on “Other” to go multiple levels down.

amCharts 4 introduces amazing Treemap visualization support. Check out the documentation and explore the code for the demos above.


We are giving away a great data visualization book each month! Subscribe to our newsletter to get monthly tips like the one above and you’ll be automatically entered in the sweepstakes to win an awesome book.