Pie Config

Configure the pie/donut slice geometry and slice labels (applies when chart.type is pie).

Every property is optional and falls back to its default. Property anchors are stable: link to any entry as #pie.propertyName, and to a member of a nested property as #pie.propertyName.memberName.

Properties

adjustCenterTotalForFiltering

Whether the center total counts only the unfiltered slices (true) or always shows the full total (false).

• Default: true
• Validation: should be a boolean

adjustLabelsForFiltering

Whether percent slice labels (and the labelMinFraction threshold) renormalize against the unfiltered slices (true) or always use every slice's share of the full total (false).

• Default: true
• Validation: should be a boolean

centerLabel

A text label shown at the center of the pie (use null for none; most useful for donut and gauge charts).

• Default: null
• Validation: should be a string or be equal to null
• Used in: Gauge

centerLabelTextStyle

The styles to apply to the center label text (strokeColor, strokeOpacity, strokeWidth, fillColor, fillOpacity (use null for none), use "currentColor" to follow the host page's css color and theme).

• Default: { strokeColor: null, strokeOpacity: null, strokeWidth: null, strokeDashArray: null, fillColor: "currentColor", fillOpacity: null }
• Validation: should be an object with any of the properties { strokeColor: should be a valid svg color (or "none" / "currentColor") or be equal to null, strokeOpacity: should be a number >= to 0 and <= 1 or be equal to null, fillColor: should be a valid svg color (or "none" / "currentColor") or be equal to null, fillOpacity: should be a number >= to 0 and <= 1 or be equal to null, strokeWidth: should be a number >= to 0 or be equal to null, strokeDashArray: should be a valid dash array or be equal to null }

centerLabelTextStyle.fillColor

The color of the fill: use null to leave the svg fill attribute unset so that css can supply it, "none" to switch the fill off, or "currentColor" to follow the host page's css color.

• Default: "currentColor"
• Validation: should be a valid svg color (or "none" / "currentColor") or be equal to null

centerLabelTextStyle.fillOpacity

The opacity (0 - 1) of the fill, or null to leave the svg fill-opacity attribute unset.

• Default: null
• Validation: should be a number >= to 0 and <= 1 or be equal to null

centerLabelTextStyle.strokeColor

The color of the stroke (outline): use null to leave the svg stroke attribute unset so that css can supply it, "none" to switch the stroke off, or "currentColor" to follow the host page's css color.

• Default: null
• Validation: should be a valid svg color (or "none" / "currentColor") or be equal to null

centerLabelTextStyle.strokeDashArray

The dash array pattern of the stroke (e.g. "5, 5"), or null for a solid stroke.

• Default: null
• Validation: should be a valid dash array or be equal to null

centerLabelTextStyle.strokeOpacity

The opacity (0 - 1) of the stroke, or null to leave the svg stroke-opacity attribute unset.

• Default: null
• Validation: should be a number >= to 0 and <= 1 or be equal to null

centerLabelTextStyle.strokeWidth

The width (in pixels) of the stroke, or null to leave the svg stroke-width attribute unset.

• Default: null
• Validation: should be a number >= to 0 or be equal to null

centerOffsetXFraction

Offset the center label and total horizontally by this fraction (-1 to 1) of the outer radius (positive moves right).

• Default: 0
• Validation: should be a number >= to -1 and <= 1

centerOffsetYFraction

Offset the center label and total vertically by this fraction (-1 to 1) of the outer radius (positive moves down; e.g. use a negative value to lift them into a gauge's hole).

• Default: 0
• Validation: should be a number >= to -1 and <= 1
• Used in: Gauge

centerTotalFormat

The d3 format specifier used to format the center total (use auto to derive a format).

• Default: "auto"
• Validation: should be a valid number format or be equal to "auto"
• Used in: Gauge

centerTotalTextStyle

The styles to apply to the center total text (strokeColor, strokeOpacity, strokeWidth, fillColor, fillOpacity (use null for none), use "currentColor" to follow the host page's css color and theme).

• Default: { strokeColor: null, strokeOpacity: null, strokeWidth: null, strokeDashArray: null, fillColor: "currentColor", fillOpacity: null }
• Validation: should be an object with any of the properties { strokeColor: should be a valid svg color (or "none" / "currentColor") or be equal to null, strokeOpacity: should be a number >= to 0 and <= 1 or be equal to null, fillColor: should be a valid svg color (or "none" / "currentColor") or be equal to null, fillOpacity: should be a number >= to 0 and <= 1 or be equal to null, strokeWidth: should be a number >= to 0 or be equal to null, strokeDashArray: should be a valid dash array or be equal to null }

centerTotalTextStyle.fillColor

The color of the fill: use null to leave the svg fill attribute unset so that css can supply it, "none" to switch the fill off, or "currentColor" to follow the host page's css color.

• Default: "currentColor"
• Validation: should be a valid svg color (or "none" / "currentColor") or be equal to null

centerTotalTextStyle.fillOpacity

The opacity (0 - 1) of the fill, or null to leave the svg fill-opacity attribute unset.

• Default: null
• Validation: should be a number >= to 0 and <= 1 or be equal to null

centerTotalTextStyle.strokeColor

The color of the stroke (outline): use null to leave the svg stroke attribute unset so that css can supply it, "none" to switch the stroke off, or "currentColor" to follow the host page's css color.

• Default: null
• Validation: should be a valid svg color (or "none" / "currentColor") or be equal to null

centerTotalTextStyle.strokeDashArray

The dash array pattern of the stroke (e.g. "5, 5"), or null for a solid stroke.

• Default: null
• Validation: should be a valid dash array or be equal to null

centerTotalTextStyle.strokeOpacity

The opacity (0 - 1) of the stroke, or null to leave the svg stroke-opacity attribute unset.

• Default: null
• Validation: should be a number >= to 0 and <= 1 or be equal to null

centerTotalTextStyle.strokeWidth

The width (in pixels) of the stroke, or null to leave the svg stroke-width attribute unset.

• Default: null
• Validation: should be a number >= to 0 or be equal to null

cornerRadius

The corner radius (in pixels) applied to the slice corners.

• Default: 0
• Validation: should be a number >= to 0
• Used in: Gauge

endAngle

The angle (in degrees, clockwise from the top) at which the last slice ends (use startAngle -90 and endAngle 90 for a half/gauge pie).

• Default: startAngle + 360 — a full circle from startAngle
• Validation: should be a number
• Used in: Gauge

focusOffsetFraction

Offset the focused slice away from the center by this fraction (0 to 1) of the outer radius (an exploded slice).

• Default: 0
• Validation: should be a number >= to 0 and <= 1
• Used in: Donut

innerRadiusFraction

The inner radius of the slices as a fraction (0 to 1) of the outer radius (use a value greater than 0 for a donut chart).

• Default: 0
• Validation: should be a number >= to 0 and <= 1
• Used in: Donut · Gauge

labelMinFraction

Hide the label of any slice whose value is smaller than this fraction (0 to 1) of the slice total.

• Default: 0.05
• Validation: should be a number >= to 0 and <= 1

labelPercentFormat

The d3 format specifier used to format the percent part of the slice labels (use auto to derive a format).

• Default: "auto"
• Validation: should be a valid number format or be equal to "auto"

labelRadiusFraction

The radial position of the slice labels as a fraction (0 to 1) between the inner radius and the outer radius.

• Default: 0.5
• Validation: should be a number >= to 0 and <= 1

labelType

The content of the slice labels: the slice value (value), the slice percentage of the total (percent), the series title (title), or a combination of two of them (valuePercent for "value (percent)", percentValue for "percent (value)", titleValue for "title: value", titlePercent for "title: percent").

• Default: "percent"
• Validation: should be one of [ "value", "percent", "valuePercent", "percentValue", "title", "titleValue", "titlePercent" ]
• Used in: Donut · Gauge

labelValueFormat

The d3 format specifier used to format the value part of the slice labels (use auto to derive a format).

• Default: "auto"
• Validation: should be a valid number format or be equal to "auto"

outerRadiusFraction

The outer radius of the slices as a fraction (0 to 1) of the largest radius that fits within the plot.

• Default: 1
• Validation: should be a number >= to 0 and <= 1

padAngle

The angle (in degrees) of the gap between adjacent slices.

• Default: 0
• Validation: should be a number >= to 0
• Used in: Gauge

showCenterTotal

Whether the total of the slice values should be shown at the center of the pie.

• Default: false
• Validation: should be a boolean
• Used in: Gauge

showLabels

Whether labels should be shown on the slices.

• Default: false
• Validation: should be a boolean
• Used in: Donut · Gauge

startAngle

The angle (in degrees, clockwise from the top) at which the first slice starts.

• Default: 0
• Validation: should be a number
• Used in: Gauge

tooltipPercentFormat

The d3 format specifier used to format the percent part of the tooltip values (use auto to derive a format).

• Default: "auto"
• Validation: should be a valid number format or be equal to "auto"

tooltipValues

The content of the tooltip value for each slice: the slice value (value), the slice percentage of the total (percent) or a combination of both (valuePercent for "value (percent)", percentValue for "percent (value)"); the value part is formatted by the series valueFormat, valuePrefix and valueSuffix, and the percent part renormalizes against the unfiltered slices unless tooltip.adjustForFiltering is false.

• Default: "value"
• Validation: should be one of [ "value", "percent", "valuePercent", "percentValue" ]
• Used in: Pie · Donut · Gauge