Set Up a Pie Chart with no Overlapping Labels in the Graph
|Product||Progress® Telerik® Reporting Graph Report Item|
How can I avoid the overlapping of the labels that represent data points with relatively small values and adjacent to each other in a Pie Chart?
By default, the layout engine will try to arrange the data labels so they do not overlap. When the bounds of two or more labels overlap, the engine will move them and their adjacent labels vertically, trying to find them a proper non-overlapping positions.
During this rearrangement, a label can be moved aside from its original location, which may produce a hard to read chart. Additionally, if the plot area doesn't provide enough space and there are a lot of data points, the labels will overlap.
The Pie Chart uses
BarSeries to represent the "pie slices". These series make use of the
OutsideColumn value of the
When the alignment is set to
OutsideColumn, the data point labels are aligned in two columns around the pie and their offset is controlled by the
DataPointLabelOffset property. If the labels needs to be adjusted so they do not overlap, their position might not be aligned against the corresponding data point. In this case, the data point connectors can be set up to provide visual aid to determine the relation between the label and a data point.
To avoid label overlapping:
In the Design view, click the chart series. The Properties Window will load the selected series properties.
Set the value of the
DataPointLabelOffsetproperty to a value, providing enough offset from the pie, depending on the chart size (for example,
Make sure the
Visibleproperty set to
Also, for better design experience, the connector is drawn only when the distance between the data point and the label is more than one line spacing, measured by its label font.
If needed, you can also adjust the connector offset by using the Padding property. The Bottom represents the offset from the pie, and the Top represents the offset from the label. The Left and Right values are not respected.
Additionally, you can set the LineColor and LineStyle according to your needs.
OutsideColumnvalue of the
DataPointLabelAlignmentproperty is respected only when applied to BarSeries with a Polar coordinate system. When applied to another series type or a Cartesian coordinate system, the engine falls back to the
The algorithm that moves the data point labels, preventing them from overlapping, is activated only when the labels have their
DataPointLabelAngleset to a multiple of 360 degrees, that is,
360, and so on.
The image below shows how a Pie Chart after the suggested solution has been implemented.