Many elements on the X axis of a chartview.

[SANDRO]

Hello good afternoon.

I ask for your support, for the following.

In a graph, when there are many elements in X, the labels come together a lot and the text is not understood.

 

When I apply a configuration by code, the graph does look better:

            horizontalAxis.MajorTickInterval = 10;
            horizontalAxis.TickLength = 10;
            horizontalAxis.TickWidth = 10;

 

I would like to start from the number of elements on the X axis that the labels begin to join, to automatically apply the aforementioned code.

My fear is that at some point, it doesn't graph well and it jumps strangely when graphing, could this happen?

Thank you so much

[Dinko | Tech Support Engineer]

Hi Sandro,

Thank you for the provided details, but I wasn't able to fully understand your scenario. May I ask you to elaborate more on what the requirement is? In general, to make the axis labels readable, you can use the LabelFitMode property of the axis which determines how the axis labels will be laid out when they overlap. The property specifies the approach the axis will use to handle label collision. The possible fit is None, Multiline, and Rotate. None renders all labels at their specified location without applying any fit logically. Multiline displays labels on a number of rows and Rotate turns the labels around a fixed point. Note that Multiline mode repositions the labels only if it is needed, while Rotate affects the labels regardless of the available space.

Looking at the second it seems to me that the Rotate option is used in your project, am I right? Have you considered using the Multiline, if not can you try and let me know if it works for you?

I am looking forward to your reply.

Regards,
Dinko | Tech Support Engineer
Progress Telerik

[SANDRO]

Hello good morning.

Indeed, the rotate option is used in the project, since multiline does not work, because with many more elements the x-axis labels pile up.

Look at the first image is of the graph, without applying this code:
horizontalAxis.MajorTickInterval = 10;
horizontalAxis.TickLength = 10;
horizontalAxis.TickWidth = 10;

And the second image is of the graph already applying the following code:
horizontalAxis.MajorTickInterval = 10;
horizontalAxis.TickLength = 10;
horizontalAxis.TickWidth = 10;

What I want to know is if it is possible to know when the labels of the graph will no longer be readable, so that until then the mentioned code is applied, because there will not always be too many elements.

[Dinko | Tech Support Engineer]

Thank you for the additional details.

To test your case, I have created a custom AxisLabelDrawPart. You can check the Custom Rendering help article which describes how to override a draw part. And I was able to catch if two labels overlap. However, changing the mentioned properties in your post, force the labels to redraw and create new labels for the axis. So the axis Children collection will contain only the visible labels and I wasn't able to find a way to reset the properties if the size of the chart is wide enough to see all labels if they were drawn. What you can try, if possible, is to check if the data points exceed a specific number, 100 for example, and then customize the ticks properties. I understand this approach won't be dynamic as I wish but you can still considered it.