Treemap Chart

Treemap

1.1 Use Cases

Treemaps are renowned for their unique hierarchical structure and intuitive data visualization, enabling users to easily comprehend complex data architectures and distributions.

• Single-dimension treemap (Figure 1) is ideal for analyzing and displaying data distributions. It helps users quickly identify key data points and understand proportions across different segments. This type is particularly useful for scenarios such as departmental performance analysis or product category sales breakdowns, providing a clear overview of overall data.

• Dual-dimension treemap (Figure 2) enhances data visualization depth by incorporating two hierarchical dimensions. It not only displays data layers for each dimension but also illustrates relationships and variations through block sizes and color gradients. This chart is especially suited for complex business scenarios, such as analyzing regional sales performance alongside product line metrics, delivering granular and comprehensive insights.

picture coming soon:
Figure 1. Single-dimension treemap

picture coming soon:
Figure 2. Dual-dimension treemap

1.2 Chart Configuration

1.2.1 Axis Data

• Dimensions: 1–2 dimensions
• Metrics: 1 metric

picture coming soon:
Figure 3. Dimensions and metrics

1.2.2 Styling (Web)

1.2.2.1 Basic Settings

• Chart title: Defaults to the analysis Subject name during creation. Custom titles can be configured.

picture coming soon:
Figure 4. Chart title

• Notes:
  • Content: Add contextual notes to clarify the chart’s purpose.
  • Display options:
    • Collapsed: Shown as an icon next to the title; hover to view.
    • Expanded: Displayed as text next to the title.
    • Hidden: Not shown in any view.

picture coming soon:
Figure 5. Adding notes

picture coming soon:
Figure 6. Collapsed note display

picture coming soon:
Figure 7. Expanded note display

• Metric name: Defaults to the metric name; customizable.

picture coming soon:
Figure 8. Modifying metric names

• Dimension name: Defaults to the dimension name; customizable.

picture coming soon:
Figure 9. Modifying dimension names

1.2.2.2 Display Settings

• Data labels:
  • Percentage: Toggle visibility of percentage values.
  • Value: Toggle visibility of metric values.
  • Dimension: Customize dimension display (e.g., line wrapping).

picture coming soon:
Figure 10. Data label configuration

• Show total: Toggle total value visibility.
  • Card view display: Enabled by default; disabled when “Show total” is off.
• Data table: Configure visibility and position (top/bottom/left/right).
  • Hide in card view: Enabled by default.

picture coming soon:
Figure 11. Data table configuration

1.2.2.3 Colors & Fonts

• Color schemes: Choose between modern (customizable) or classic (fixed) palettes. Accessibility patterns can be enabled.
• Font size: Adjust from preset options.

picture coming soon:
Figure 12. Color schemes

picture coming soon:
Figure 13. Font size

1.2.2.4 Custom Zoom

• Zoom in/out in edit, view, preview, or card modes. Includes one-click reset.

picture coming soon:
Figure 14. Zoom-in effect

picture coming soon:
Figure 15. Zoom-out effect

1.2.3 Styling (Mobile)

1.2.3.1 Inherit Web Layout

• Mirrors Web configurations; no independent settings.

picture coming soon:
Figure 16. Inherited Web configurations

1.2.3.2 Independent Layout

• Defaults to Web settings but allows mobile-specific adjustments. Fewer options than Web; unsupported settings follow Web rules.

picture coming soon:
Figure 17. Mobile-independent layout configuration