The article has been updated successfully.How can I display legend in Pie & Doughnut charts?
FusionCharts v3.2 supports Legends in Pie and Doughnut charts. The legends are interactive and iconic (Pie like symbol) with numerous new features and properties.
To enable legend for a pie/doughnut chart, you use the following data:
<chart showLegend="1" caption="Sales Per Employee for year 1996" palette="2" animation="1" formatNumberScale="0" numberPrefix="$" pieSliceDepth="30" startingAngle="125">
<set label="Leverling" value="100524"/>
<set label="Fuller" value="87790" isSliced="1" />
<set label="Davolio" value="81898" isSliced="0" />
<set label="Peacock" value="76438" isSliced="0" />
<set label="King" value="57430" isSliced="0" />
<set label="Callahan" value="55091" isSliced="0" />
<set label="Dodsworth" value="43962" isSliced="0" />
<set label="Suyama" value="22474" isSliced="0" />
<set label="Buchanan" value="21637" isSliced="0" />
</chart>
This results in the chart below. Note how the pie that is sliced out (of Fuller) also shows in the legend with a border around it. Again, the legend here is interactive. When you click on a legend item, the respective pie slice moves in/out.
Let us a take a look at the attributes that adds on to the features of the Legend:
| Attribute Name | Description |
|---|---|
showLegend |
Whether to show the Legend on the chart |
legendPosition |
The Legend can be plotted below (BOTTOM) or RIGHT of the chart |
legendCaption |
A caption can be set for the entire Legend |
legendIconScale |
Scaling of legend icon is possible starting FusionCharts v3.2. This attribute lets you control the size of legend icon |
legendBgColor |
Background color for the legend |
legendBgAlpha |
Background Alpha for the legend |
legendBorderColor |
Border color for the legend |
legendBorderThickness |
Border thickness for the legend |
legendBorderAlpha |
Border alpha for the legend |
legendShadow |
Whether to show a shadow for legend |
legendAllowDrag |
The legend can be made drag-able by setting this attribute to 1. End viewers of the chart can drag the legend around on the chart |
legendScrollBgColor |
A scroll bar shows up if there are too many items on the legend. This attribute lets you configure the background color of the scroll bar |
legendScrollBtnColor |
A scroll bar shows up if there are too many items on the legend. This attribute lets you configure the color of the buttons of the scroll bar |
everseLegend |
You can reverse the ordering of datasets in the legend by setting this attribute to 1 |
interactiveLegend |
This attribute lets you interact with the legend in your chart. When you click a particular legend key, the associated sector slides out from the chart. Re-clicking the key causes the sector to slide in |
legendNumColumns |
If your chart contains multiple series, the legend is displayed as a grid comprising of multiple legend keys. With the help of this attribute you can specify the number of columns that are to be displayed in the legend |
minimiseWrappingInLegend |
Whether to minimize legend item text wrapping |
Earlier, only in Multi-series / Combination charts, the series name of each data-set shows up in the legend of the chart. FusionCharts v3.2 had introduced the same for the labels in the Pie Charts. This helps you relate a data plot to its labels using its color.
The legend does not appear for other single-series charts.
Related Articles
No related articles were found.Attachments
No attachments were found.Visitor Comments
Article Details
Last Updated
13th of October, 2010
Would you like to...
User Opinions
100%
0%
(1 vote)