Plugin renderer to draw a pie chart. x values, if present, will be used as slice labels. y values give slice size.

To use this renderer, you need to include the pie renderer plugin, for example:

<script type="text/javascript" src="plugins/jqplot.pieRenderer.js"></script>

Properties described here are passed into the $.jqplot function as options on the series renderer.  For example:

plot2 = $.jqplot('chart2', [s1, s2], {
    seriesDefaults: {
        renderer:$.jqplot.PieRenderer,
        rendererOptions:{
             sliceMargin: 2,
             startAngle: -90
         }
     }
});

A pie plot will trigger events on the plot target according to user interaction.  All events return the event object, the series index, the point (slice) index, and the point data for the appropriate slice.

’jqplotDataMouseOver’triggered when user mouseing over a slice.
’jqplotDataHighlight’triggered the first time user mouses over a slice, if highlighting is enabled.
’jqplotDataUnhighlight’triggered when a user moves the mouse out of a highlighted slice.
’jqplotDataClick’triggered when the user clicks on a slice.
’jqplotDataRightClick’tiggered when the user right clicks on a slice if the “captureRightClick” option is set to true on the plot.
Summary
$.jqplot.PieRendererPlugin renderer to draw a pie chart.
Properties
diameterOuter diameter of the pie, auto computed by default
paddingpadding between the pie and plot edges, legend, etc.
sliceMarginangular spacing between pie slices in degrees.
filltrue or false, wether to fil the slices.
shadowOffsetoffset of the shadow from the slice and offset of each succesive stroke of the shadow from the last.
shadowAlphatransparency of the shadow (0 = transparent, 1 = opaque)
shadowDepthnumber of strokes to apply to the shadow, each stroke offset shadowOffset from the last.
highlightMouseOverTrue to highlight slice when moused over.
highlightMouseDownTrue to highlight when a mouse button is pressed over a slice.
highlightColorsan array of colors to use when highlighting a slice.
dataLabelsEither ‘label’, ‘value’, ‘percent’ or an array of labels to place on the pie slices.
showDataLabelstrue to show data labels on slices.
dataLabelFormatStringFormat string for data labels.
dataLabelThresholdThreshhold in percentage (0-100) of pie area, below which no label will be displayed.
dataLabelPositionFactorA Multiplier (0-1) of the pie radius which controls position of label on slice.
dataLabelNudgeNumber of pixels to slide the label away from (+) or toward (-) the center of the pie.
dataLabelCenterOnTrue to center the data label at its position.
startAngleAngle to start drawing pie in degrees.
$.jqplot.PieLegendRendererLegend Renderer specific to pie plots.
Properties
numberRowsMaximum number of rows in the legend.
numberColumnsMaximum number of columns in the legend.

Properties

diameter

this.diameter = null

Outer diameter of the pie, auto computed by default

padding

this.padding = 20

padding between the pie and plot edges, legend, etc.

sliceMargin

this.sliceMargin = 0

angular spacing between pie slices in degrees.

fill

this.fill = true

true or false, wether to fil the slices.

shadowOffset

this.shadowOffset = 2

offset of the shadow from the slice and offset of each succesive stroke of the shadow from the last.

shadowAlpha

this.shadowAlpha = 0.07

transparency of the shadow (0 = transparent, 1 = opaque)

shadowDepth

this.shadowDepth = 5

number of strokes to apply to the shadow, each stroke offset shadowOffset from the last.

highlightMouseOver

this.highlightMouseOver = true

True to highlight slice when moused over.  This must be false to enable highlightMouseDown to highlight when clicking on a slice.

highlightMouseDown

this.highlightMouseDown = false

True to highlight when a mouse button is pressed over a slice.  This will be disabled if highlightMouseOver is true.

highlightColors

this.highlightColors = []

an array of colors to use when highlighting a slice.

dataLabels

this.dataLabels = 'percent'

Either ‘label’, ‘value’, ‘percent’ or an array of labels to place on the pie slices.  Defaults to percentage of each pie slice.

showDataLabels

this.showDataLabels = false

true to show data labels on slices.

dataLabelFormatString

this.dataLabelFormatString = null

Format string for data labels.  If none, ‘%s’ is used for “label” and for arrays, ‘%d’ for value and ‘%d%%’ for percentage.

dataLabelThreshold

this.dataLabelThreshold = 3

Threshhold in percentage (0-100) of pie area, below which no label will be displayed.  This applies to all label types, not just to percentage labels.

dataLabelPositionFactor

this.dataLabelPositionFactor = 0.52

A Multiplier (0-1) of the pie radius which controls position of label on slice.  Increasing will slide label toward edge of pie, decreasing will slide label toward center of pie.

dataLabelNudge

this.dataLabelNudge = 2

Number of pixels to slide the label away from (+) or toward (-) the center of the pie.

dataLabelCenterOn

this.dataLabelCenterOn = true

True to center the data label at its position.  False to set the inside facing edge of the label at its position.

startAngle

this.startAngle = 0

Angle to start drawing pie in degrees.  According to orientation of canvas coordinate system: 0 = on the positive x axis -90 = on the positive y axis.  90 = on the negaive y axis.  180 or - 180 = on the negative x axis.

$.jqplot.PieLegendRenderer

Legend Renderer specific to pie plots.  Set by default when user creates a pie plot.

Summary
Properties
numberRowsMaximum number of rows in the legend.
numberColumnsMaximum number of columns in the legend.

Properties

numberRows

this.numberRows = null

Maximum number of rows in the legend.  0 or null for unlimited.

numberColumns

this.numberColumns = null

Maximum number of columns in the legend.  0 or null for unlimited.

this.diameter = null
Outer diameter of the pie, auto computed by default
this.padding = 20
padding between the pie and plot edges, legend, etc.
this.sliceMargin = 0
angular spacing between pie slices in degrees.
this.fill = true
true or false, wether to fil the slices.
this.shadowOffset = 2
offset of the shadow from the slice and offset of each succesive stroke of the shadow from the last.
this.shadowAlpha = 0.07
transparency of the shadow (0 = transparent, 1 = opaque)
this.shadowDepth = 5
number of strokes to apply to the shadow, each stroke offset shadowOffset from the last.
this.highlightMouseOver = true
True to highlight slice when moused over.
this.highlightMouseDown = false
True to highlight when a mouse button is pressed over a slice.
this.highlightColors = []
an array of colors to use when highlighting a slice.
this.dataLabels = 'percent'
Either ‘label’, ‘value’, ‘percent’ or an array of labels to place on the pie slices.
this.showDataLabels = false
true to show data labels on slices.
this.dataLabelFormatString = null
Format string for data labels.
this.dataLabelThreshold = 3
Threshhold in percentage (0-100) of pie area, below which no label will be displayed.
this.dataLabelPositionFactor = 0.52
A Multiplier (0-1) of the pie radius which controls position of label on slice.
this.dataLabelNudge = 2
Number of pixels to slide the label away from (+) or toward (-) the center of the pie.
this.dataLabelCenterOn = true
True to center the data label at its position.
this.startAngle = 0
Angle to start drawing pie in degrees.
this.numberRows = null
Maximum number of rows in the legend.
this.numberColumns = null
Maximum number of columns in the legend.
Close