Proportional Charts show how a whole splits into parts.
Pie Chart divides a circle into slices to show simple part-to-whole proportions.
Donut Chart is a Pie Chart with a hollow centre, leaving room for a central metric or label.
The example below places a Pie Chart beside a Donut Chart splitting the same annual revenue across sales channels, so the hollow centre is the only difference between them.
Setup Copy Link
| Slot | Required | Accepts | What it does |
|---|---|---|---|
| Label | Yes | One category | Adds one slice for each value of the field, and names it in the legend. |
| Angle | Yes | One numeric field | Sets the size of each slice, as its share of the total. |
| Tooltip | No | Any fields | Shows the fields in the tooltip without plotting them. |
Each Pie or Donut Chart shows one numeric field, so to compare several fields, add a chart for each.
In the example above, Sales Channel is in the Label slot and Revenue is in the Angle slot.
Tooltip Copy Link
The tooltip shows each slice's value and its share of the total. Fields in the Tooltip slot are added to the tooltip but are not plotted. Use the slot for context that would clutter the chart, such as the number of units behind each revenue figure.
In the example below, each slice shows revenue for a product category, and the Setup tab is open beside the chart. Hover over a slice to see its Units Sold and Returns, which are in the Tooltip slot.
Format Copy Link
Pie and Donut Charts have these settings of their own on the Format tab, beside the title and appearance settings every chart has. Your developer can change the defaults shown.
| Setting | Where | Default | What it does |
|---|---|---|---|
| Legend | Elements | On | Shows the legend, with one item for each slice. Position places it around the chart, at the bottom by default. |
| Data Labels | Elements | Off | Labels each slice. Position puts the label outside or inside the slice. Format shows the value or the percentage of the total. Category adds the slice's name. Font and Color change the label text. |
| Total Label | Elements | Off | Donut Chart only. Shows the total of the numeric field in the hollow centre. Font and Color change the text. |
| Segment Borders | Elements | Off | Draws a border around each slice. Width and Color change the border. |
When you turn on Data Labels, they start outside the slices and show each slice's percentage of the total, without its name.
Segment Borders keep slices with similar colours distinct. The border is 1 pixel wide and matches the page's Widget background colour until you change it. Slices are separated by a thin gap even with Segment Borders off; turn them on to widen or recolour that edge.
The example below shows each setting turned on in its own chart, over the same data. The first four charts show the Data Labels options on a Pie Chart. The Donut Chart next to the Total Label one shows data labels around a ring.