TreeMap
The TreeMap visualizes the distribution of hierarchical data. It uses nested
rectangles of different sizes and colors to show how much each category or
subcategory contributes to the whole data set.
TreeMapProps
, , | Name | Type | Default | Description |
|---|---|---|---|
data | | The tree map data to display. | |
width? | 100% | Optional width of the chart. | |
height? | | | 400 | Optional height of the chart. |
colorPalette? | | | [] | 'categorical' | Color palette to use for coloring the tree nodes. Nodes of height 1 get a color assigned from the palette. |
formatter? | | <, > | | Custom value formatter for the chart. |
truncationMode? | 'middle' | The text truncation mode used for the chart legend. | |
loading? | false | Show the loading indicator. | |
labelsDisplay? | 'none' | Show/hide label on TreeMap nodes and clusters | |
seriesActions? | (node: ) => | | Exposed callback to display series actions for a node |
valueAccessor? | undefined | Data accessor on leaf nodes by which legend can be defined | |
nameAccessor? | undefined | Data accessor on leaf nodes by which legend can be defined | |
min? | | | | The min value configuration to display |
max? | | | | The max value configuration to display |
TreeMap.Legend
To configure the legend, add TreeMap.Legend to the TreeMap chart.
TreemapChartLegendConfig
Signature:
export declare type TreemapChartLegendConfig = ;TreeMap.Tooltip
To configure the tooltip, add TreeMap.Tooltip to the TreeMap chart.
TreeMap.EmptyState
TreeMap.EmptyState provides a slot where the Empty state wrapper can be set.
EmptyStateProp
| Name | Type | Default | Description |
|---|---|---|---|
children | |
TreeMap.ErrorStateSlotProps
TreeMap.ErrorState provides a slot where the Error state wrapper can be set.
ErrorStateProps
| Name | Type | Default | Description |
|---|---|---|---|
children | | ((errorMessage: ) => .) | |