Treemap

📌 What are they?

The Treemap is a hierarchical visualization in the form of nested rectangles. Each rectangle represents a category or subcategory, and its size is proportional to an associated numeric value. It is ideal for showing composition, distribution, and hierarchies within a dataset.

🔍 In TOKII, it allows representing multiple KPIs or comparable units in a compact and visually impactful view.

🎯 When to use them?

Visualize the proportional distribution of a total among several parts.
Quickly compare magnitudes between elements without an explicit axis.
Show hierarchical categories (e.g. line → machine).
Represent aggregated data in limited spaces (dashboard).

📥 Data Sending Formats

▸ From dataset

Example structure:

Continent	Country	Population (millions)
Asia	India	1,429
Asia	China	1,416
Asia	Indonesia	285
Asia	Others	1,005
America	United States	347
America	Brazil	213
America	Mexico	131
America	Others	94
Africa	Nigeria	238
Africa	Egypt	116
Africa	Democratic Republic of the Congo	109
Africa	Others	126
Europe	Russia	145
Europe	Germany	84
Europe	United Kingdom	69
Europe	Others	131
Oceania	Australia	26.97
Oceania	Papua New Guinea	10.76
Oceania	New Zealand	5.25
Oceania	Others	2.80

Label: Country (each rectangle)
Label type: String (type of labels)
Values: Population (size of rectangles)
Group: Continent
Popup: Continent, Country, Population

▸ From MQTT

{
  "India": {"value": 1429, "group": "Asia"},
  "China": {"value": 1416, "group": "Asia"},
  "Indonesia": {"value": 285, "group": "Asia"},
  "Otros Asia": {"value": 1005, "group": "Asia"},
  "Estados Unidos": {"value": 347, "group": "América"},
  "Brasil": {"value": 213, "group": "América"},
  "México": {"value": 131, "group": "América"},
  "Otros América": {"value": 94, "group": "América"},
  "Nigeria": {"value": 238, "group": "África"},
  "Egipto": {"value": 116, "group": "África"},
  "República Democrática del Congo": {"value": 109, "group": "África"},
  "Otros África": {"value": 126, "group": "África"},
  "Rusia": {"value": 145, "group": "Europa"},
  "Alemania": {"value": 84, "group": "Europa"},
  "Reino Unido": {"value": 69, "group": "Europa"},
  "Otros Europa": {"value": 131, "group": "Europa"},
  "Australia": {"value": 26.97, "group": "Oceanía"},
  "Papúa Nueva Guinea": {"value": 10.76, "group": "Oceanía"},
  "Nueva Zelanda": {"value": 5.25, "group": "Oceanía"},
  "Otros Oceanía": {"value": 2.80, "group": "Oceanía"}
}

Puntos conectados

Information panel

Any questions? Write to us.