---
title: "Sunburst"
description: "A hierarchical radial visualization for representing multi-level data structures and their proportions."
group: Charts
tags: [Visualization, Chart, Dashboard, Hierarchical, Radial, Multi-level, Sunburst]
---

import { Aside, Steps } from '@astrojs/starlight/components';

# Sunburst

The **Sunburst Chart** is a radial, multi-level hierarchical visualization ideal for displaying how values are distributed across nested categories.  
It uses concentric rings to represent levels in a hierarchy, with each ring segment’s size proportional to its value.

**Use cases:**
- Representing **organizational hierarchies**
- Displaying **part-to-whole relationships** in nested data
- Visualizing **breakdowns within breakdowns** (like category → subcategory → sub-subcategory)

<Aside>
Use **Sunburst Charts** when your data naturally forms a hierarchy with multiple levels of categorization.  
Avoid using it for flat data or when the number of categories is too large to remain visually clear.
</Aside>

---

## ⚙️ Setup

<Steps>
1. Drag the **Sunburst Chart** widget from the chart library onto your designer workspace.
2. Select the chart.
3. Go to the [Widget Configuration](/insights-v8/guide-to-infoboard-designer/customize-panel/configure/) tab in the Configuration panel.
4. Under the Configuration panel tab, select the [Basic Configuration](/insights-v8/guide-to-infoboard-designer/customize-panel/configure/#basic) option to access essential settings for the Sunburst Chart.
5. Select the [Source](/insights-v8/guide-to-infoboard-designer/customize-panel/setup/#sources) from which the chart will fetch its data.
6. Map:
   - **[Measure](/studio-v8/datasources/measures-dimensions-and-hierarchies/)** — Numeric value representing the size of each segment.
   - **[Dimension](/studio-v8/datasources/measures-dimensions-and-hierarchies/)** — Sequential categorical fields representing hierarchy levels. Minimum of **2** and maximum of **4** levels.
7. Optionally add a **Date** field for time-based filtering.
</Steps>

---

## 📊 Basic Configuration

| Configuration Item   | Description |
|:---------------------|:-------------|
| **[Source](/insights-v8/guide-to-infoboard-designer/customize-panel/setup/#sources)**        | The data source to query for chart values. |
| **[Measure](/studio-v8/datasources/measures-dimensions-and-hierarchies/)**   | Numeric value representing the weight of each node/segment. |
| **[Dimension](/studio-v8/datasources/measures-dimensions-and-hierarchies/)**  | Categorical fields forming a hierarchy. Minimum 2, maximum 4 sequential levels. |
| **Date Field** (optional) | Enables date-based filtering and drilldown capability. |

<Aside type="note">
Ensure each level of the **Dimension hierarchy** meaningfully segments the data, or omit unnecessary levels to avoid visual clutter.
</Aside>

---

## 🎨 Chart Customizations

| Category                     | Options & Description |
|:----------------------------|:-----------------------------------------------------------|
| **[General](/insights-v8/guide-to-infoboard-designer/customize-panel/customization-tab/#general)** | Theme, background, and interactivity options. |
| **[Title](/insights-v8/guide-to-infoboard-designer/customize-panel/customization-tab/#title)** | Chart title, font, alignment, and visibility settings. |
| **[Sorting](/insights-v8/guide-to-infoboard-designer/customize-panel/customization-tab/#sorting)** | Control sorting order of nodes at each hierarchy level. |
| **[Position](/insights-v8/guide-to-infoboard-designer/customize-panel/customization-tab/#position)** | Set horizontal and vertical alignment of the chart. |
| **[HeatMap](/insights-v8/guide-to-infoboard-designer/customize-panel/customization-tab/#heatmap)** | Visualize segment values via gradient coloring. |
| **[Series](/insights-v8/guide-to-infoboard-designer/customize-panel/customization-tab/#series-customization)** | Configure node colors, labels, label lines, smoothness, and value formatting. |
| **[Tooltip](/insights-v8/guide-to-infoboard-designer/customize-panel/customization-tab/#tooltip)** | Tooltip content, format, and triggers for displaying segment details. |
| **Others** | Set options like **Clockwise rendering**, **Rotation angle**, **Inner/Outer radius**, **Use same color for parent and child**, label alignment, and label line settings. |

<Aside>
Use **HeatMap coloring** to emphasize value ranges visually within the sunburst segments.
</Aside>

---

## 📊 Example Visualization

![sunburst chart](/images/Insights/Infoboards/Infoboard-Designer/Chart-Library/sunburst-chart.png)

