[syncfusion_flutter_charts] Tick labeling: make ticks that have no label look somehow different

[WieFel]

Hi,

I have a chart whose labels don't all fit on the x-axis. Labels that don't fit are hidden, which is fine.
The only thing is that as the label texts are quite long, it is difficult to understand which label belongs to which tick:

Is there a way to hide ticks whose label is hidden, or somehow make them look different (e.g. in opacity, etc.)?

[Yuvaraj-Gajaraj]

Hi @WieFel

Greetings from Syncfusion. We have analyzed your query and we would like to let you know that currently the particular tick alone can't be hidden for the hidden labels. However, you can rotate the labels using the labelRotation property of axis. Also, you can position the labels bases on the labels intersection using the labelIntersectAction property. Using the labelRotation property you can rotate the axis labels as per your scenario and also you can use the labelIntersectAction property to position the labels if the labels get intersects. We have provided the code snippet below for your reference, you can use either one of these based on your scenario

Code snippet:

primaryXAxis: DateTimeAxis(
 // Rotates the label when it get intersect
 labelIntersectAction: AxisLabelIntersectAction.rotate90,
 // Rotates the axis label as per the given angle
 labelRotation: 90,
),

To know more on labels customization, kindly find the user guide from below,
https://help.syncfusion.com/flutter/cartesian-charts/axis-customization#smart-axis-labels

Regards,
Yuvaraj.

[WieFel]

@Yuvaraj-Gajaraj thank you very much for your suggestion.

Unfortunately, rotating the axis labels in my case makes the problem even worse:

Are there any other suggestions?

[Yuvaraj-Gajaraj]

Hi WieFel,

We have analyzed your query and we would like to let you know that in default the label of the date time axis will gets render with some interval without collide each other. We suspect that you have set the DateTimeAxis interval to 1 that is why the data label get render like this. We suggest you set interval of DateTimeAxis more than 1 or leave it as default.

We hope this will help you to achieve your requirement.

Regards,
Yuvaraj.