Donut Chart
A donut chart displays data as sectors of a circle, where each sector represents a part of the whole. The sum of all sectors equals 100 %.
Widget Settings
In addition to the common widget settings, this widget has unique configuration options.
Data Settings
You can add one dimension and multiple measures to the widget. Working with local indicators is described on the Dimensions and Measures page.
For a measure, you can additionally enable the display of the absolute value. For a dimension, you can enable array nesting, hide empty values, assign click actions, and configure the Display parameter (Always / By variable / By formula).
You can assign colors to both dimensions and measures. Display rules applicable to the widget are defined either at the workspace level in the Data Model or in the indicators tab of the dashboard.
The available color configuration modes for dimensions and measures depend on the widget’s setup.
| Without dimension | With dimension |
|---|---|
| For the measure, the following modes are available: 1. Solid | For the dimension, the following modes are available: 1. Disabled 2. By values (rules with Solid mode are available for values) 3. By rule (rules based on the added dimension are available for values) For the measure, the following modes are available: 1. Auto (default) 2. Gradient (to avoid excessive intermediate colors, configure the number of classes—between 3 and 10) 3. By rule (rules with Gradient or Custom mode are available for values) 4. Custom (by formula) |
Display Settings
Text Size
Controls the font size of text within the widget.
Dimension Limit
Controls the number of segments displayed on the chart.
Hint
When enabled, hovering over a segment in Browse mode displays a hint with detailed information about the data shown.
Type
You can configure the chart’s display type: doughnut (with a hollow center) or pie (full circle). The screenshot below shows an example of a full-circle (pie) chart.
Additional Display Settings
Additionally, you can hide empty values and enable the legend for this widget.
Filtering Settings
The widget supports standard filtering settings.
A filter configured within the widget cannot be removed in Browse mode.
- Values in a donut chart are displayed as percentages.
- Other is calculated as 100 % minus the sum of all displayed segments.
- The Other segment is not clickable.
Widget Configuration in YAML
The widget can be edited not only in the view but also in the YAML editor. The table below lists the keys and values you can use for configuration. For details on working with the value key, refer to Dimension and Measure Values in YAML. Supported data formats are described on the corresponding page. General widget parameters are covered in Widget Configuration in YAML.
Data Settings in YAML
| Key | Type | Definition |
|---|---|---|
| title | string | Title |
| showMarkdown | boolean | Description |
| markdownText | string | Description text |
| markdownMeasures | — | Measures in description |
| dimensions | — | Dimensions |
| measures | — | Measures |
| sorting | — | Sorting |
Dimensions in YAML (key: dimensions)
| Key | Type | Definition |
|---|---|---|
| name | string | Dimension name |
| value | — | Dimension formula |
| dbDataType | enum | Dimension data type |
| format | enum | Format |
| formatting | enum | Formatting |
| formattingTemplate | string | Custom formatting Only available for CUSTOM (Custom) formatting |
| hideEmptyValues | boolean | Hide empty values |
| hierarchyDimensions | — | Hierarchy dimensions If this parameter is added, the indicator is treated as hierarchical |
| onClick | — | Click actions Not applied if the indicator is hierarchical |
| color | — | Color: - DISABLED — Disabled- VALUES — By values- RULE — By ruleNot applied if the dimension is hierarchical |
| displayCondition | — | Display (display condition) |
| arrayNesting | boolean | Array nesting |
Hierarchical Dimension (key: hierarchyDimensions)
| Key | Type | Definition |
|---|---|---|
| name | string | Dimension name |
| value | — | Dimension formula |
| dbDataType | enum | Dimension data type |
| format | enum | Format |
| formatting | enum | Formatting |
| formattingTemplate | string | Custom formatting Only available for CUSTOM (Custom) formatting |
| hideEmptyValues | boolean | Hide empty values |
| onClick | — | Click actions |
| color | — | Color: - DISABLED — Disabled- VALUES — By values- RULE — By rule |
| displayCondition | — | Display (display condition) |
| arrayNesting | boolean | Array nesting |
Measures in YAML (key: measures)
| Key | Type | Definition |
|---|---|---|
| name | string | Measure name |
| value | — | Measure formula |
| dbDataType | enum | Formula data type |
| format | enum | Format |
| formatting | enum | Formatting |
| formattingTemplate | string | Custom formatting Only available for CUSTOM (Custom) formatting |
| showLabels | — | Data labels |
| color | — | Color Available modes without dimension: - AUTO — Auto- BASE — Solid- RULE — By ruleAvailable modes with dimension: - AUTO — Auto- GRADIENT — Gradient- RULE — By rule- FORMULA — By formula |
| displayCondition | — | Display (display condition) |
Value Labels (key: showLabels)
| Key | Type | Definition |
|---|---|---|
| enabled | boolean | Labels on/off |
| absolute | boolean | Absolute values |
| size | number | Label size |
Display Settings in YAML
| Key | Type | Definition |
|---|---|---|
| paddings | string | Side paddings |
| titleSize | number | Title size |
| titleColor | — | Title color: - AUTO — Auto- BASE — Solid |
| titleWeight | enum | Title font weight: - NORMAL — Normal- BOLD — Bold |
| markdownTextSize | number | Description text Specifies the Markdown description font size. Available only if the Description toggle is enabled |
| textSize | number | Text size |
| dimensionLimit | number | Dimension limit |
| hideEmptyValues | boolean | Hide empty values |
| showHint | boolean | Hint |
| legend | — | Legend |
| chartType | enum | Chart type: - PIE — pie chart (full circle)- DONUT — doughnut chart (with a hollow center) |
Filtering Settings in YAML
| Key | Type | Definition |
|---|---|---|
| filterMode | enum | Filter mode: - DEFAULT — Default- SINGLE — Single selection- DISABLED — Disabled |
| ignoreFilters | boolean | Ignore filters |
| filters | — | Filters |
| aggregateFilters | — | Aggregate filters |
| stateName | string | State |
Example of a Configured Widget in the YAML Editor
widgets:
- key: donut-chart
apiVersion: "17"
type: DONUT_CHART
settings:
titleColor:
mode: AUTO
titleSize: 14
paddings: 8
titleWeight: NORMAL
textSize: 12
filterMode: DEFAULT
ignoreFilters: false
stateName: null
title: ""
showMarkdown: false
markdownMeasures: []
markdownText: ""
markdownTextSize: 14
dimensions:
- name: Continent
value:
mode: FORMULA
formula: '"store"."Continent"'
dbDataType: String
hideEmptyValues: false
format:
value: STRING
mode: BASE
formatting:
value: AUTO
mode: BASE
onClick: []
displayCondition:
mode: DISABLED
color:
mode: DISABLED
measures:
- name: Amount
value:
mode: FORMULA
formula: count()
dbDataType: UInt64
formatting:
value: AUTO
mode: BASE
format:
value: NUMBER
mode: BASE
showLabels:
enabled: true
absolute: false
size: 12
displayCondition:
mode: DISABLED
color:
mode: AUTO
chartType: PIE
legend:
position: RIGHT
verticalAlign: TOP
width:
value: null
mode: PIXEL
dimensionLimit: 10
filters: []
Was the article helpful?