Spacing between axis info text on X and Y axis

Question

Hello!I haven't been able to find a way to evenly display the spacing between the info texts on the X and Y axis, this is what I have tried:1.- Change RangePadding property2.- Set the Margin to zero3.- Change the EdgeLabelDrawingMode property4.- Use a LabelTemplate5.- Getting the Width of the whole chart and try to set the position of the text elements based on the number of the text and the chart WidthHow can I evenly display the text based on the data displayed? (Attaching some images)

Vimala Thirumalai Kumar · Accepted Answer

Hi Mario,In the provided sample, the X axis is set as DateTimeAxis. DateTimeAxis is a range based axis and interval are calculated by using the datetime scale. By default, the axis labels that are intersected with others will be hidden. Due to this showing the axis labels with equal spacing in DateTimeAxis is not working.We can resolve this by customizing the date time axis label count with specified intervals for various data range changes as per the below code sample. internal class CustomDateTimeAxis: DateTimeAxis { protected override void OnCreateLabels() { base.OnCreateLabels(); VisibleLabels.Clear(); var startDate = DateTime.FromOADate(VisibleMinimum); var endDate = DateTime.FromOADate(VisibleMaximum); //Considered that we need 5 labels. so divided by 5. var totalDays = (endDate - startDate).TotalDays / 5; while (endDate >= startDate) { if (endDate == DateTime.FromOADate(VisibleMaximum)) VisibleLabels.Add(new ChartAxisLabel(endDate.ToOADate(), "Today")); VisibleLabels.Add(new ChartAxisLabel(endDate.ToOADate(), endDate.ToString("M/dd")));//Set label format if needed. endDate = endDate.AddDays(-totalDays); } } } …. Note: We do not recommend this approach while using DateTimeAxis due to the axis datetime range change for dynamic update.Incase if you want equal spacing between the axis labels. We would like to suggest CategoryAxis as x-axis instead of the DateTimeAxis. By default, the category axis labels will be shown with equal spacing, and position based on index.Please refer the below link for more detailshttps://help.syncfusion.com/xamarin/charts/axis#category-axisPlease find the modified sample in the attachment below and let us know if you need any further assistance.Regards,Vimala Thirumalai KumarAttachment: SF_177494_b5918317.zip

Devakumar Dhanapoosanam · Answer

Hi Mario,Query: How can I evenly display the text based on the data displayed?We would like to let you know that using the axis Interval property we can set equal intervals in the axis range. In Y-Axis top label 5.74k axis interval not having 1 as compared to other labels. We can resolve this by setting the axis RangePadding value as AppendInterval as per in the below code example. https://help.syncfusion.com/xamarin/charts/axis#customizing-numeric-interval https://help.syncfusion.com/xamarin/charts/axis#apply-padding-to-the-range https://help.syncfusion.com/xamarin/charts/axis#date-time-intervals https://help.syncfusion.com/xamarin/charts/axis#date-time-intervals Note: If axis Maximum property value is set then axis maximum value only gets applied.Also, we would like to let you know that by default, the axis labels that are intersected with each other will be hidden. In the provided chart image x-axis we suspect the axis labels hidden. Please refer the below link for more details https://help.syncfusion.com/xamarin/charts/axis#smart-axis-labels https://www.syncfusion.com/kb/8242/how-to-show-all-the-axis-labels https://www.syncfusion.com/kb/12520/how-to-set-the-count-of-visible-axis-labels-in-xamarin-forms-charts Incase if you still face any problem could you please share the complete chart code files with data points details which will be helpful for us to provide you a better solution at the earliest.Please check and let us know if you need any further assistance.Regards,Devakumar D If this post is helpful, please consider Accepting it as the solution so that other members can locate it more quickly.

Mario · Answer

Hello Devakumar,I haven't been able to resolve it with the RangePadding and Interval properties.The chart is dynamically populated and I must say that there are some rules, for example:
There is a time period selector where the user can choose between "1 month", "3 months", "6 months", "1 year" and "All".
Depending on the option the user chooses is the number of labels to display including "Today". For example, if the user chooses "1 month", the number of labels to display is 5, etc.
I share a demo with mocked data. For this demo I have simulated data with a time period selected "All".If you have another suggestion to try or if you see a mistake in the demo please let me know, I would really appreciate it.Regards.Attachment: SyncfusionDemo_c3a34312.zip

Vimala Thirumalai Kumar · Answer

Hi Mario,We have checked the provided sample and found that the axis Minimum and Maximum value were set in Y axis, hence the Y-Axis interval is not evenly calculated. Due to this the Y-Axis top label 3.2K interval and spacing is less compared to other labels interval. We can resolve this by customizing the number of axis labels count with specified intervals for various data range changes as per the below code sample. public class CustomNumericAxis : NumericalAxis { protected override void OnCreateLabels() { base.OnCreateLabels(); if (VisibleLabels != null) { VisibleLabels.Clear(); //Considered that we need 5 labels. so divided by 5. var interval = (VisibleMaximum - VisibleMinimum) / 5; var start = VisibleMinimum; while (start <= VisibleMaximum) { start = Math.Round(start, 1); VisibleLabels.Add(new ChartAxisLabel(start, start.ToString()));//Set label format if needed. start += interval; } } } } …. Please refer the below link for more detailshttps://www.syncfusion.com/kb/12520/how-to-set-the-count-of-visible-axis-labels-in-xamarin-forms-chartsAlso, we would like to let you know that by default, the axis labels that are intersected with each other will be hidden. If you want to display all the axis labels, we can achieve by using LabelsIntersectAction property as MultipleRows.Please refer the below link for more detailshttps://www.syncfusion.com/kb/8242/how-to-show-all-the-axis-labelsCurrently, we are customizing the provided sample to show equal intervals and axis label spacing based on your requirement and we will update the complete details in one business day on September 29, 2022.Regards,Vimala Thirumalai Kumar.

Mario · Answer

Thank you very much

Vimala Thirumalai Kumar · Answer

Hi Mario,Thanks for your update.Please let us know if you need any further assistance.Regards,Vimala Thirumalai Kumar