The plugin assumes that each series has a single data value, and that
The plugin assumes that each series has a single data value, and that each
each value is a positive integer or zero. Negative numbers don't make
value is a positive integer or zero. Negative numbers don't make sense for a
sense for a pie chart, and have unpredictable results. The values do
pie chart, and have unpredictable results. The values do NOT need to be
NOT need to be passed in as percentages; the plugin will calculate the
passed in as percentages; the plugin will calculate the total and per-slice
total and per-slice percentages internally.
percentages internally.
* Created by Brian Medendorp, June 2009
* Created by Brian Medendorp
* Updated November 2009 with contributions from: btburnett3, Anthony Aragues and Xavi Ivars
* Updated with contributions from btburnett3, Anthony Aragues and Xavi Ivars
* Changes:
2009-10-22: lineJoin set to round
The plugin supports these options:
2009-10-23: IE full circle fix, donut
2009-11-11: Added basic hover from btburnett3 - does not work in IE, and center is off in Chrome and Opera
series: {
2009-11-17: Added IE hover capability submitted by Anthony Aragues
pie: {
2009-11-18: Added bug fix submitted by Xavi Ivars (issues with arrays when other JS libraries are included as well)
show: true/false
radius: 0-1 for percentage of fullsize, or a specified pixel length, or 'auto'
Available options are:
innerRadius: 0-1 for percentage of fullsize or a specified pixel length, for creating a donut effect
series: {
startAngle: 0-2 factor of PI used for starting angle (in radians) i.e 3/2 starts at the top, 0 and 2 have the same result
pie: {
tilt: 0-1 for percentage to tilt the pie, where 1 is no tilt, and 0 is completely flat (nothing will show)
show: true/false
offset: {
radius: 0-1 for percentage of fullsize, or a specified pixel length, or 'auto'
top: integer value to move the pie up or down
innerRadius: 0-1 for percentage of fullsize or a specified pixel length, for creating a donut effect
left: integer value to move the pie left or right, or 'auto'
startAngle: 0-2 factor of PI used for starting angle (in radians) i.e 3/2 starts at the top, 0 and 2 have the same result
tilt: 0-1 for percentage to tilt the pie, where 1 is no tilt, and 0 is completely flat (nothing will show)
offset: {
top: integer value to move the pie up or down
left: integer value to move the pie left or right, or 'auto'
},
stroke: {
color: any hexidecimal color value (other formats may or may not work, so best to stick with something like '#FFF')
width: integer pixel width of the stroke
},
label: {
show: true/false, or 'auto'
formatter: a user-defined function that modifies the text/style of the label text
radius: 0-1 for percentage of fullsize, or a specified pixel length
background: {
color: any hexidecimal color value (other formats may or may not work, so best to stick with something like '#000')
opacity: 0-1
},
},
threshold: 0-1 for the percentage value at which to hide labels (if they're too small)
stroke: {
},
color: any hexidecimal color value (other formats may or may not work, so best to stick with something like '#FFF')
combine: {
width: integer pixel width of the stroke
threshold: 0-1 for the percentage value at which to combine slices (if they're too small)
},
color: any hexidecimal color value (other formats may or may not work, so best to stick with something like '#CCC'), if null, the plugin will automatically use the color of the first slice to be combined
label: {
label: any text value of what the combined slice should be labeled
show: true/false, or 'auto'
}
formatter: a user-defined function that modifies the text/style of the label text
highlight: {
radius: 0-1 for percentage of fullsize, or a specified pixel length
opacity: 0-1
background: {
color: any hexidecimal color value (other formats may or may not work, so best to stick with something like '#000')
opacity: 0-1
},
threshold: 0-1 for the percentage value at which to hide labels (if they're too small)
},
combine: {
threshold: 0-1 for the percentage value at which to combine slices (if they're too small)
color: any hexidecimal color value (other formats may or may not work, so best to stick with something like '#CCC'), if null, the plugin will automatically use the color of the first slice to be combined
label: any text value of what the combined slice should be labeled
}
highlight: {
opacity: 0-1
}
}
}
}
}
}
More detail and specific examples can be found in the included HTML file.
More detail and specific examples can be found in the included HTML file.