Treemap

Use a treemap to visualize hierarchical data as nested rectangles sized by a numeric value. Each level of the hierarchy is subdivided into smaller rectangles, making it easier to compare how categories and subcategories contribute to the whole.

Treemaps are useful for comparing proportions across categories, showing part-to-whole relationships, and identifying concentration patterns in hierarchical data. For example, you can use a treemap to compare storage usage by business unit and application, event volume by category and source, or cost by service and environment.

Data formatting

A treemap uses a primary data source. Format the search results as a table with a numeric value field and string fields that identify each node. To show a hierarchy, include a parent ID field that maps each node to its parent.

| table <value_field> <node_id_field> [<node_label_field>] [<parent_id_field>] [<tooltip_field> ...]

value_field

Required numeric field that determines the size or area of each node.

node_id_field

Required string field that identifies each node in the hierarchy.

node_label_field

Optional string field that provides the display label. If omitted, use the node ID field as the label.

parent_id_field

Optional field that identifies a node's parent. Omit it for a single-level treemap.

tooltip_field

Optional field displayed in the tooltip. Multiple tooltip fields are supported.

Use Result limit to control the maximum number of data points rendered. The default result limit is 10,000. When there are more nodes than can fit clearly, Treemap collapses small nodes into an “Others” node that users can drill into.

Generate a treemap

1. Select the Add chart button in the editing toolbar and choose Treemap.

2. Set up a data source by selecting Create search and adding a search to the SPL query window, or select an existing data source.

3. Optionally change the ID in Data source name.

4. Select Apply and close.

5. Select the treemap on the canvas and use the Configuration panel to map Value, Node ID, and Label fields.

6. Optionally map Parent ID, add tooltip fields, and configure display or color options.

Configuration panel options for treemaps

Use the following options to configure a treemap.

Title

Give the visualization a name. The title is useful when searching for individual visualizations and is distinct from the automatically assigned unique ID.

Description

Describe what the user is viewing.

Data sources

Choose an existing search or create a new one. You can hide the element when data is unavailable or configure custom visibility conditions.

Position and size

In absolute layout, resize the panel with the mouse or use this section for pixel-perfect placement.

Value

Numeric field that determines the size of each node.

Node ID

Field that identifies each node.

Label

Field that displays the node label.

Parent ID

Field that defines parent-child relationships.

Additional tooltip field(s)

Extra fields displayed when users hover over nodes.

Result limit

Maximum number of rendered data points.

Sum from leaf nodes

Calculates parent values from child leaf values instead of using provided parent values.

Show values

Displays values for child and leaf nodes.

Show subdivisions

Displays nested subdivisions inside parent nodes.

Show parent values

Displays parent values when subdivisions are shown.

Show tooltip

Enables a tooltip when users hover over nodes.

Legend display

Places the legend at the bottom of the panel or turns it off.

Color and style

• Use series colors to assign fixed colors to each series.

• Use dynamic coloring to apply colors based on data values.

• Use a gradient, numeric ranges, or specific matches to color data. An asterisk (*) is a wildcard in match values.

• Specify a background color for the visualization.

Interactions and source code

Use drilldown to create interactivity. Users can click a leaf or parent node to set tokens, link to a custom URL, or open another dashboard.

Select a visualization or its search to view and edit source code in real time. You can also change the Visualization ID to a more readable ID.

Example: two-level treemap with series colors

This example compares usage across Infrastructure, Applications, and Security categories. It uses series colors and does not enable subdivisions.

| makeresults
| eval rows="Infrastructure,240;Applications,210;Security,100;Compute,120;Storage,80;Network,40;Search,90;Ingest,70;Dashboards,50;Detection,65;Response,35"
| makemv delim=";" rows
| mvexpand rows
| eval parts=split(rows,",")
| eval label=mvindex(parts,0)
| eval usage=tonumber(mvindex(parts,1))
| eval parent_id=case(label="Compute" OR label="Storage" OR label="Network","Infrastructure", label="Search" OR label="Ingest" OR label="Dashboards","Applications", label="Detection" OR label="Response","Security", true(), null())
| eval node_id=label
| table usage node_id label parent_id

{ "type": "splunk.treemap", "options": { "sumFromLeafNodes": true, "showTooltip": true, "showSubdivisions": false }, "title": "Service Usage Treemap" }

Example: three-level treemap with dynamic coloring

This example compares values across regions, countries, and cities. It enables subdivisions, uses gradient-based dynamic coloring, and displays the legend at the bottom.

| makeresults
| eval data="North America,World,0,region;Europe,World,0,region;Asia,World,0,region;United States,North America,0,country;Canada,North America,0,country;United Kingdom,Europe,0,country;France,Europe,0,country;Germany,Europe,0,country;Japan,Asia,0,country;South Korea,Asia,0,country;India,Asia,0,country;New York,United States,8419600,city;Los Angeles,United States,3980400,city;Toronto,Canada,2794356,city;London,United Kingdom,8982000,city;Paris,France,2161000,city;Berlin,Germany,3769000,city;Munich,Germany,1472000,city;Tokyo,Japan,13960000,city;Seoul,South Korea,9498000,city;Mumbai,India,12440000,city;Delhi,India,11320000,city"
| makemv delim=";" data
| mvexpand data
| eval parts=split(data,",")
| eval child=mvindex(parts,0)
| eval parent=mvindex(parts,1)
| eval value=tonumber(mvindex(parts,2))
| eval level=mvindex(parts,3)
| table child parent value level

{ "type": "splunk.treemap", "options": { "sumFromLeafNodes": true, "legendDisplay": "bottom", "dataColors": "> dataColorValues | gradient(dataColorsEditorConfig)" }, "title": "Population by Region, Country, and City" }

Source options for treemaps