Overlapping vertical axis custom labels

[Viollier]

Hi there,

i have a line chart with custom labels on the vertical axis. Sometimes, the labels values are very close to each other, so the text overlaps (please see the attached file). Is there any way to solve this automatically?

 

Thanks!

[Sophi]

Hello Viollier,

Could you, please, send us a code snippet of your chart setup, that will ease us greatly in finding the cause of the issue.

Looking forward to hearing from you. 

Regards,
Sophi
Telerik by Progress

[Viollier]

Hi Sophi,

thanks for the reply! The issue appears when the custom labels' values are too close to each other. Here is how i customize the vertical axis:

 

void AddChartBandAnnotation()
{
    var range = GetChartBandRange();
    var fillColor = new UIColor(0.83f, 0.92f, 0.88f, 0.6f);
    var strokeColor = new UIColor(0.6f, 0.85f, 0.76f, 0.8f);
    var fill = new TKSolidFill(fillColor);
    var stroke = new TKStroke(strokeColor, 1.5f);
    var annotation = new TKChartBandAnnotation(range, Chart.YAxis, fill, stroke);
    Chart.RemoveAllAnnotations();
    Chart.AddAnnotation(annotation);

    //apparently, by not clearing the labels before, the new ones don't show up correctly
    Chart.BeginUpdates();
    Chart.YAxis.CustomLabels = new NSDictionary();
    Chart.EndUpdates();


    var labels = GetVerticalAxisLabels();
    if (labels.Count > 0)
    {
        Chart.YAxis.CustomLabels = labels;
        Chart.YAxis.Style.LabelStyle.TextAlignment = TKChartAxisLabelAlignment.Left;
        Chart.YAxis.Style.LabelStyle.FirstLabelTextAlignment = TKChartAxisLabelAlignment.Left;
        Chart.YAxis.Style.LabelStyle.TextOffset = new UIOffset(2, 0);
        Chart.YAxis.Style.LabelStyle.FirstLabelTextOffset = new UIOffset(2, 0);
        Chart.YAxis.Style.LabelStyle.TextHidden = false;

    }
    else
    {
        Chart.YAxis.Style.LabelStyle.TextHidden = true;
    }


    Chart.YAxis.AllowPan = false;
    Chart.YAxis.AllowZoom = false;

    Chart.Update();

}


NSDictionary GetVerticalAxisLabels()
{
    NSMutableDictionary dictionary = new NSMutableDictionary();
    var labels = ChartModel.Labels;

    foreach (KeyValuePair<double, ValueType> entry in labels)
    {
        UIColor color = UIColor.Black;
        dictionary.Add(new NSNumber(entry.Key), color);
    }

    return dictionary;
}

[Sophi]

Hi Violler,

If the values are too close to each other(the difference between the is very small) it is expected to observe some overlapping. 

You can try setting different offset values or rotation angle of the labels (these all are properties of the labelStyle you have used to style the axis), or maybe smaller font size. 

If that doesn't work maybe you should consider showing less labels or changing the range of the axis.


Regards,
Sophi
Telerik by Progress