Basic pie chart
A pie chart is a divided into sectors,
illustrating numerical proportion. In a pie chart, the arc
length of each sector (and consequently its central angle
and area), is proportional to the quantity it represents.
While it is named for its resemblance to a pie which has
been sliced, there are variations on the way it can be
presented.
Rotated pie chart
By default, pie charts begin with the left
edge of the first slice pointing straight up. You can
change that with the pieStartAngle option.
Here, we rotate the chart clockwise 180 degrees with an
option of pieStartAngle: 180. So chosen
because that particular angle happens to make the slices
reflected.
Basic donut chart
A donut chart is functionally identical to a
pie chart, with the exception of a blank center and the
ability to support multiple statistics at once. donut
charts provide a better data intensity ratio to standard
pie charts since the blank center can be used to display
additional related data.
Rotated donut chart
By default, donut charts begin with the left
edge of the first slice pointing straight up. You can
change that with the pieStartAngle option.
Here, we rotate the chart clockwise 180 degrees with an
option of pieStartAngle: 180. So chosen
because that particular angle happens to make the slices
reflected.
3D pie charts
A 3D pie chart is used to give the chart a 3D
look. Often used for aesthetic reasons, the third dimension
does not improve the reading of the data; on the contrary,
these plots are difficult to interpret because of the
distorted effect of perspective associated with the third
dimension. The use of superfluous dimensions not used to
display the data of interest is discouraged for charts in
general, not only for pie charts.
Exploded pie charts
Example of pie charts withexploded slices. Pie
slices can be separated from the rest of the chart with the
offset property of the slices option. To separate a slice,
create a slices object and assign the appropriate slice number
an offset between 0 and 1. Below, we assign progressively
larger offsets to slices 4 (Gujarati), 12 (Marathi), 14
(Oriya), and 15 (Punjabi). Examples below display both pie and
donut chart versions.
Diff pie charts
Inner circle radius
Example of diff pie chart with
radius factor - the relative size of the
circles can be controlled with
diff.innerCircle.radiusFactor option.
Inner circle transparency
Example of diff pie chart with
transparency - the transparency of each
data can be controlled with
diff.oldData.opacity and
diff.newData.opacity.
Inner circle border
Example of diff pie chart with
border factor - the border between the two
datas can be controlled with
diff.innerCircle.borderFactor option.
Inverted difference
Example of diff pie chart with
inverted behaviour - the behavior can be
inverted so that the oldest data surrounds the newest
data with diff.oldData.inCenter option.