Mermaid treemap in Markdown to PDF

Nested rectangles are sized by value, with formatted numbers and styled classes.

Nested rectangles sized by value, with a value format and a styled class, for the stock of a warehouse by category.

Open PDFOpen in editorMarkdown file

Markdown source

Markdown · 43 lines
# Treemaps

```mermaid
---
config:
  treemap:
    valueFormat: '0,0'
---
treemap
"Stock on hand, pallets"
    "Food and drink"
        "Ambient": 1840
        "Chilled": 620
        "Frozen": 410
    "Home"
        "Furniture": 530
        "Kitchen": 390
        "Textiles": 270
    "Garden"
        "Tools": 180
        "Plants and seeds": 95
    "Electronics"
        "Small appliances": 310
        "Audio and video": 140
```

A class marks the categories that need attention:

```mermaid
treemap
"Storage used, terabytes"
    "Media":::warning
        "Video": 120
        "Photos": 80
        "Audio": 25
    "Documents"
        "Contracts": 35
        "Correspondence": 15
    "Backups": 60
    "System": 40

classDef warning fill:#f59e0b,stroke:#78350f;
```

Rendered pages

PDF · 1 page · 10 KB
  1. Treemaps, page 1 of 1

The sample documents describe invented organizations in several countries. All names and figures are illustrative.

Mermaid charts in Markdown to PDF: every sampleIn the Markdown reference