Prevent data point label from overlapping line on chart

[Raga]

I am using a CustomLabelRenderer for my line chart because I don't want the speech-bubble border that the default labels have. I draw the data point label a fixed distance either above or below the data point depending on the y position of the data point. The problem is, depending on the shape of the line chart, the labels sometimes overlap with the line chart's line, as shown in the attached image. I would like the labels to not overlap the line. Is there something in the API that can calculate the optimal placement of my labels that avoids overlapping my line?

[Deyan]

Hi Raga,

Thanks for writing and for the provided screenshot.

With a custom label renderer you will have to calculate this behavior by yourself. For example, you could make the following estimation:

1. If the neighbouring data points of the current data point have a bigger Y axis value of the current data point - draw the label below the data point.

2. If the neighbouring data points of the current data point have a smaller Y axis value of the current data point - draw the label above the data point.

3. If the left/right data point's value is bigger/smaller draw the current data point's label floating to the right/left of the data point itself.


I hope this is helpful.

Regards,
Deyan
Telerik by Progress