The first I have to say that Flot is outstanding product. But I missed
pie charts and decided don't wait for author and take my needs in my
hands.
I present you my implementation of pie chart with Flot.
There is example:
http://javascript.cooldev.com/flot-pie/
Modified source:
http://javascript.cooldev.com/flot-pie/jquery.flot.pie.js
the same but packed:
http://javascript.cooldev.com/flot-pie/jquery.flot.pie.pack.js
Archived example:
http://javascript.cooldev.com/flot-pie/FlotPie.zip
Data array format:
[
{ label: "Serie1", data: 10},
{ label: "Serie2", data: 30},
{ label: "Serie3", data: 90},
{ label: "Serie4", data: 70},
{ label: "Serie5", data: 80},
{ label: "Serie6", data: 110}
]
Configuration options:
pie: {
show: true,
pieStrokeLineWidth: 1,
pieStrokeColor: '#FFF',
pieChartRadius: 100, // by default it calculated by
centerOffsetTop:30, // top offset of pie center
centerOffsetLeft:30, // if 'auto' and legend position is "nw" then
centerOffsetLeft is equal a width of legend.
showLabel: true, //use ".pieLabel div" to format looks of labels
labelOffsetFactor: 5/6, // part of radius (default 5/6)
labelOffset: 0 // offset in pixels if > 0 then
labelOffsetFactor is ignored
labelBackgroundOpacity: 0.55, // default is 0.85
labelFormatter: function(serie){// default formatter is "serie.label"
//return serie.label;
//return serie.data;
return serie.label+'<br/>'+Math.round(serie.percent)+'%';
}
}
Sergey Nosenko
#javascript navigation for your sites
http://javascript.cooldev.com