Pie

Pie type specific features.

Z Values

In addition to the general pie type, a secondary value can be encoded into point z properties. If point z values are defined, it will vary the pie slice radius. Both positive and negative Z values can be used which create different visual effects.

The z values are plotted along a Z axis which is similar to a polar Y axis. The Z axis is 0 based and behaves similar to a normal column chart, except the columns are slices.

These pie charts demonstrate the different behaviors of using positive, negative, and both positive and negative z values.

Figure 1.

Reference:
Donut Chart Slice Length Variations Sample Differing positive and negative pie z values.

Z Value Formatting

The x and Y axis formatString settings provide default formatting for those values in any point related text such as labels and tooltips.

While the Z axis is not currently a property of chart, the formatting properties of the Z axis can be set at the chart level as shown below.

This image shows a chart with z values representing life expectancy.

Figure 2.

The code below specifies the format string as number with one decimal place and is how the format of the above highlighted part of the tooltip is applied.

{
  zAxisFormatString: "n2"
}

Reference:
Legend Labels Pie Chart Sample Draw pie with z values controlling slice length.
Expressions Tutorial Create dynamic labels using expressions.
Token Reference Tutorial Tokens available to create dynamic label content.

Angles & Arcs

Starting angles can be used with pie charts.

{
  defaultSeries_angle: 45
}

Reference:
Pie Chart Starting Angle Sample Pie chart with a starting angle.

Starting and ending angles can be used together to create pie arcs as with the following example.

Figure 3.

{
  defaultSeries_angle: {
    start: 80,
    end: 100
  }
}

Reference:
Donut Arc Sample Pie arc that shows data on only 20 degrees oriented to the right.

The angleArc object also provides properties for orientation and sweep. Orientation is the center angle between start and end angles.

The following has the same effect as the above start and end angle settings, however, it is given in orientation and sweep which makes it easier to think about.

{
  defaultSeries_angle: {
    orientation: 90,
    sweep: 20
  }
}

Sweep can be given in numeric degrees or as a percentage string such as '50%' which is equivalent to 180 degrees. If a string is provided, tokens can also be used. For example, consider a series of pie data split into two series. One series can be set with an orientation of -90 degrees (facing left) and the other with 90 degrees (facing right). The sweep can be set with '%percentOfTotal%'. This creates the effect of a single pie separated into two.

This case can be especially useful when there are many smaller points on a pie chart. They can be put into a different pie arc which automatically scales up in size.

Figure 4.

{
  series: [
    {
      name: "Left Side",
      angle: { orientation: -90, sweep: "%PercentOfTotal%" },
      points: [
        /*...*/
      ]
    },
    {
      name: "Right Side",
      angle: { orientation: 90, sweep: "%PercentOfTotal%" },
      points: [
        /*...*/
      ]
    }
  ]
}

Reference:
Proportional Arc Donut Segments Sample Pie series with arcs relative to sums of each series.

Documentation

Tutorials

Pie

Z Values

Z Value Formatting

Angles & Arcs