Custom logic for changing Y axis maximum value

[Piotr]

Hello,

I'm working on an application that uses SfChart line chart to display live data (updated a few times per second). Number of points and their X-values are constant. Y-values of points can only be positive (including 0). So on each update only Y-values of points change. Both X-axis and Y-axis are numeric.

On each update, the maximum value of the Y-axis is recalculated to fit the screen, which makes the graph "jump" a few times per second. It is unreadable for user to watch jumping chart. I want Y-axis to be more stable. E.g. some behavior like this:

1. If max Y of last update is bigger than current max of y-axis, resize y-axis (we want to show whole chart, not cut some part of it)

2. If max Y of latest update is SLIGHTLY smaller than current max of Y axis, do nothing (if chart fills e.g. 70% of screen, it's ok for readability, we don't want to resize it)

3. If max Y of latest update is SIGNIFICANTLY less than current max of y-axis, resize y-axis (if chart fills e.g. 20% of screen, we want to resize y-axis to fill all screen)

I could look for maximum Y value on every update and set YAxis.Maximum manually in my business logic, but I want to avoid this for performance reasons. Is it possible to achieve the described behavior with mechanisms built in SfChart library?

I tried to use YAxis.ActualRangeChanged but I couldn't get the behavior from point 3 (I couldn't find a way to get the small value that chart wants to fit to).

Thank you for suggestions how to solve my problem.

[Sowndharya Selladurai]

Hi Piotr,

We are validating your query and update today EOD

Regards,

Sowndharya Selladurai.

[Sowndharya Selladurai]

Hi Piotr,

You can achieve your desired result by setting the RangePadding property to AppendInterval
for a numerical axis. This will update the Y-axis range automatically, and the chart will become visible. In below attached the document for reference: https://help.syncfusion.com/xamarin/charts/axis

<chart:SfChart.SecondaryAxis>

                <chart:NumericalAxis  RangePadding="AppendInterval">

</chart:NumericalAxis>

            </chart:SfChart.SecondaryAxis>

I hope this helps!

Regards,

Sowndharya Selladurai.

[Piotr]

Hi Sowndharya Selladurai,

Is it possible to increase the size of appended interval? It looks better with RangePadding set to AppendInterval than to None, but I want to resize chart when current max Y value of data is significantly lower than Y axis max value. The RangePadding option gives me too little margin.

[Sowndharya Selladurai]

Hi Piotr,

To set RangePadding to AppendInterval, the chart automatically adds an interval to the end of the Y-axis range. The size of this interval is determined by the chart y-axis interval property.

If you want to increase the size of the appended interval, you can increase the value of the y-axis interval property. However, this will also increase the distance between each tick mark on the Y-axis and will also give a margin.

Regards,

Sowndharya.

[Piotr]

Hi Sowndharya Selladurai,

thank you for your reply. Is it possible to set Interval as relative value, not direct? If I set it to 1 and want to plot signal of amplitude 10^-3, Y axis range is too big. On the other hand, If I have signal with amplitude 1000, Interval of 1 does not change anything.

[Saravanan Madheswaran]

Hi Piotr,

I understand that the axis labels count remains fixed even if the range goes beyond any predefined limit. For example, if the signal has an amplitude of 10^-3, the y-axis displays 10 labels. The same count [10] should be shown for a signal with an amplitude of 1000. This approach ensures that there are no significant jumps in the chart when it is regenerated.

Please let me know if I have correctly understood your concern, or if you have any further feedback.

Regards,

Saravanan.

[Piotr]

Hi Saravanan,

I set Y Axis RangePadding property to AppendInterval and Interval property to 1. The problem is that my chart shows data that can have different amplitudes. It can show signal with amplitude 10^-3 or 100.

If it shows signal with small amplitude (which varies from e.g. 2 * 10^-3 to 2.5 * 10^-3 between refreshes), the chart looks like on the screenshot. The y-axis is scaled to 2 and the data is displayed as a tiny line at the bottom.

On the other hand, if I load data with high amplitude, the chart would jump, because appending 1 doesn't matter when values vary between e.g. 100 and 110.

That's why I would like to make appended margin size relative to amplitudes of signal (something similar to algorithm I described in post).

[Sowndharya Selladurai]

Hi Piotr,

 

We are validating your query and will be discussing it with our team. We will update our response shortly. Thank you for your patience.

 

 

Regards,

Sowndharya.

[Sowndharya Selladurai]

Hi Piotr,

To update the Y-axis interval based on the values being displayed, we used the ActualRangeChanged event. When this event is triggered, we retrieve the actual minimum and maximum values of the Y-axis and calculate the difference between them. We then divide this difference into 10 equally sized intervals and set this delta value as the new Y-axis interval.

This approach ensures that the Y-axis interval is always adjusted based on the range of values being displayed. Whenever the Y-axis values change, the interval is automatically updated to provide a more appropriate visualization of the data.

<chart:SfChart.SecondaryAxis  >

 

 <chart:NumericalAxis x:Name="secondaryAxis" RangePadding="AppendInterval"   ActualRangeChanged="NumericalAxis_ActualRangeChanged"/>

 

 </chart:SfChart.SecondaryAxis>

private void NumericalAxis_ActualRangeChanged(object sender, ActualRangeChangedEventArgs e)

{

            var min = e.ActualMinimum;

            var max = e.ActualMaximum;

            var delta = (double)(max) - (double) (min)/10;

 

            secondaryAxis.Interval = delta;

}

I hope this helps! Let me know if need further assistance.

Regards,

Sowndharya.