jqplot.donutRenderer.js

Summary

jqplot.donutRenderer.js
$.jqplot.DonutRenderer	Plugin renderer to draw a donut chart.
Properties
diameter	Outer diameter of the donut, auto computed by default
innerDiameter	Inner diameter of the donut, auto calculated by default.
thickness	thickness of the donut, auto computed by default Overridden by if innerDiameter is specified.
padding	padding between the donut and plot edges, legend, etc.
sliceMargin	angular spacing between donut slices in degrees.
ringMargin	pixel distance between rings, or multiple series in a donut plot.
fill	true or false, whether to fil the slices.
shadowOffset	offset of the shadow from the slice and offset of each succesive stroke of the shadow from the last.
shadowAlpha	transparency of the shadow (0 = transparent, 1 = opaque)
shadowDepth	number of strokes to apply to the shadow, each stroke offset shadowOffset from the last.
highlightMouseOver	True to highlight slice when moused over.
highlightMouseDown	True to highlight when a mouse button is pressed over a slice.
highlightColors	an array of colors to use when highlighting a slice.
dataLabels	Either ‘label’, ‘value’, ‘percent’ or an array of labels to place on the pie slices.
showDataLabels	true to show data labels on slices.
totalLabel	true to show total label in the centre
dataLabelFormatString	Format string for data labels.
dataLabelThreshold
dataLabelPositionFactor	A Multiplier (0-1) of the pie radius which controls position of label on slice.
dataLabelNudge	Number of pixels to slide the label away from (+) or toward (-) the center of the pie.
startAngle	Angle to start drawing donut in degrees.
$.jqplot.DonutLegendRenderer	Legend Renderer specific to donut plots.
Properties
numberRows	Maximum number of rows in the legend.
numberColumns	Maximum number of columns in the legend.

$.jqplot.DonutRenderer

Plugin renderer to draw a donut 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 donut renderer plugin, for example:

<script type="text/javascript" src="plugins/jqplot.donutRenderer.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.DonutRenderer,
        rendererOptions:{
             sliceMargin: 2,
             innerDiameter: 110,
             startAngle: -90
         }
     }
});

A donut 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

Properties
diameter	Outer diameter of the donut, auto computed by default
innerDiameter	Inner diameter of the donut, auto calculated by default.
thickness	thickness of the donut, auto computed by default Overridden by if innerDiameter is specified.
padding	padding between the donut and plot edges, legend, etc.
sliceMargin	angular spacing between donut slices in degrees.
ringMargin	pixel distance between rings, or multiple series in a donut plot.
fill	true or false, whether to fil the slices.
shadowOffset	offset of the shadow from the slice and offset of each succesive stroke of the shadow from the last.
shadowAlpha	transparency of the shadow (0 = transparent, 1 = opaque)
shadowDepth	number of strokes to apply to the shadow, each stroke offset shadowOffset from the last.
highlightMouseOver	True to highlight slice when moused over.
highlightMouseDown	True to highlight when a mouse button is pressed over a slice.
highlightColors	an array of colors to use when highlighting a slice.
dataLabels	Either ‘label’, ‘value’, ‘percent’ or an array of labels to place on the pie slices.
showDataLabels	true to show data labels on slices.
totalLabel	true to show total label in the centre
dataLabelFormatString	Format string for data labels.
dataLabelThreshold
dataLabelPositionFactor	A Multiplier (0-1) of the pie radius which controls position of label on slice.
dataLabelNudge	Number of pixels to slide the label away from (+) or toward (-) the center of the pie.
startAngle	Angle to start drawing donut in degrees.

Properties

diameter

this.diameter = null

Outer diameter of the donut, auto computed by default

innerDiameter

this.innerDiameter = null

Inner diameter of the donut, auto calculated by default. If specified will override thickness value.

thickness

this.thickness = null

thickness of the donut, auto computed by default Overridden by if innerDiameter is specified.

padding

this.padding = 20

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

sliceMargin

this.sliceMargin = 0

angular spacing between donut slices in degrees.

ringMargin

this.ringMargin = null

pixel distance between rings, or multiple series in a donut plot. null will compute ringMargin based on sliceMargin.

fill

this.fill = true

true or false, whether 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.

totalLabel

this.totalLabel = false

true to show total label in the centre

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.4

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 = 0

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

startAngle

this.startAngle = 0

Angle to start drawing donut 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.DonutLegendRenderer

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

Summary

Properties
numberRows	Maximum number of rows in the legend.
numberColumns	Maximum 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.