In case there are less number of data points and shorter label text, axis labels are rendered without any overlapping. However, axis labels may overlap due to its long text or large numbers of data points in chart.
To manage overlapped axis labels in FlexChart, use the following options.
Trim or Wrap Axis Labels
In case there are overlapping labels in the chart for any reason, you can manage the same using the OverlappingLabels property.
The OverlappingLabels property accepts the following values in the OverlappingLabels enumeration:
| Property | Description |
|---|---|
| Auto | Hides overlapping labels. |
| Show | Shows all labels including the overlapping ones. |
| Trim | Trim label, if it's larger than the available width. |
| WordWrap | Wrap label, if it's larger than the available width. |
Here is the code snippet:
Staggered Axis Lines
Another way to handle overlapping of axis labels is to stagger them for better visibility. Staggered axis labels can generated by using StaggeredLines property. This property accepts an integer value and the default value is set to 1.
