jqplot : pie chart
by Shree Khanal
HTML
<script src="//cdn.jsdelivr.net/jqplot/1.0.4/jquery.jqplot.min.js"></script>
<link rel="stylesheet" href="//cdn.jsdelivr.net/jqplot/1.0.4/jquery.jqplot.min.css">
<script src="//cdn.jsdelivr.net/jqplot/1.0.4/plugins/jqplot.donutRenderer.min.js"></script>
<script src="//cdn.jsdelivr.net/jqplot/1.0.4/plugins/jqplot.pieRenderer.min.js"></script>
<div id="chart1" style="width:400px; height: 300px;"></div>
CSS
.jqplot-data-label
JavaScript
var data = [
['Heavy Industry', 12],['Retail', 9], ['Light Industry', 14],
['Out of home', 16],['Commuting', 7], ['Orientation', 9]
];
var plot1 = jQuery.jqplot ('chart1', [data],
{
seriesDefaults: {
// Make this a pie chart.
renderer: jQuery.jqplot.PieRenderer,
rendererOptions: {
// Put data labels on the pie slices.
// By default, labels show the percentage of the slice.
showDataLabels: true,
sliceMargin: 6,
startAngle: -90
}
},
legend: { show:true, location: 'e' }
}
);