How to format labels in a pie-chart in C# chart control

Question

I am experiencing an issue, where if the disparity between the largest column is much greater than the other columns, then the labels of the pie-chart are all over each other. Looks ugly.

My pie-chart control:-

<div id="demographicsCharting" class="demographicsCharting" runat="server">
        <p style="margin:10px 0 0 10px;">
            <b>Demographics of Employees:</b>
        </p>
        <asp:Chart ID="demographicsChart" runat="server" Palette="SeaGreen" Width="382px" ImageType="Jpeg" >
            <Legends>
                <asp:Legend Name="StateCategories" IsTextAutoFit="true"></asp:Legend>
            </Legends>
            <Series>
                <asp:Series Name="State" YValueType="Int32" ChartType="Pie" IsVisibleInLegend="true" >
                </asp:Series>
            </Series>
            <ChartAreas>
                <asp:ChartArea Name="Default"></asp:ChartArea>
            </ChartAreas>
        </asp:Chart>
    </div>

On the server-side:-

// Get dictionary: key-value pair for number of employees per state //
var stateArray = CreateStateDictionary(Employees);
demographicsCharting.Attributes.Add("style", "display:block");

// map all the key-value pairs to the charting asp control //
demographicsChart.Series["State"].Points.DataBindXY(stateArray.Keys, stateArray.Values);

Either I need to make my pie-chart bigger to be able to give enough space for each label on the chart. Or I need to be able to move the labels out of the pie chart and put them around the circumference.

I tried something like this:-

Axis Label Styles and Formats

You can set the axis label styles using the Axis object's LabelStyle property. Label style properties you set in this property, such as LabelStyle.Font, apply to an axis' labels. If the axis labels are too close to each other, you can set the LabelStyle.LabelsAutoFit or LabelStyle.Offset property to True.

But couldn't get it to work.

Any help is appreciated.

Philo Philo · Accepted Answer · 2015-10-12T16:31:07

I used the following technique to solve my issue. Although not fully satisfied.

In my chart Area:-

<ChartAreas>
            <asp:ChartArea Name="Default" Area3DStyle-Enable3D="true"></asp:ChartArea>
</ChartAreas>

In my code behind:-

demographicsChart.Series["State"]["PieLabelStyle"] = "Outside";

How to format labels in a pie-chart in C# chart control

1 Answers