A treemap displays hierarchical data as a set of nested rectangles. Each parent category is a large rectangle subdivided into smaller rectangles representing its children. The area of each rectangle is proportional to its value, making it easy to compare both the overall size of categories and the relative sizes of items within them.

Treemaps are well suited to budget breakdowns, reading lists organised by genre and length, time tracking, and any data set where you want to see both the whole and its parts at once.

This diagram type is experimental and requires Mermaid v11 or later.

treemap-beta
"Reading List"
    "Fiction"
        "Novels": 12
        "Short stories": 8
    "Non-Fiction"
        "Biography": 6
        "History": 9
        "Science": 5
    "Poetry"
        "Classic": 4
        "Contemporary": 3

The hierarchy is created entirely by indentation. Leaf nodes — those at the deepest level of indentation — carry a numeric value; parent nodes have their value calculated automatically as the sum of their children.

```mermaid
treemap-beta
"Reading List"
    "Fiction"
        "Novels": 12
        "Short stories": 8
    "Non-Fiction"
        "Biography": 6
        "History": 9
        "Science": 5
    "Poetry"
        "Classic": 4
        "Contemporary": 3
```

For more treemap diagram syntax see the treemap diagram documentation at mermaid.js.org