Unable to scroll through the chart while receiving live data

Question

I am working on a Flutter application that uses the Syncfusion Flutter Chart library to display a real-time candle chart. The goal is to:

Draw and updating the actual price received from an API in real-time, updating height of candle as soon as new data is available.
Add a new candle every minute and start drawing the next one.
Display only the last 50 candles on the chart.

The functionality to draw the actual price and update the chart works well. However, I am facing issues with scrolling the chart. Specifically, when I try to scroll back to see previous data, the chart either doesn't move or, if it does, it automatically snaps back to the starting position.

Approaches Tried:

Using ValueListenableBuilder:
- The actual price line updates correctly.
- Scrolling is problematic as the chart resets to the initial position.
Using ChartSeriesController:
- Similar issues with the chart resetting its position during scrolling.

Requirements:

The chart should allow users to scroll back to view previous data without automatically resetting the view.
The actual price line should be drawn and updated in real-time without disrupting the ability to scroll.

Bellow are two approaches described above and code snippets posted on github:

https://github.com/syncfusion/flutter-widgets/issues/2007

Preethika Selvam · Answer

Hi Mateusz,We have analyzed your query, and we can reproduce the reported case when we use a autoScrollingDelta, according to our current implementation, when doing live update using autoScrollingDelta, the chart scroll to the end automatically to view the current data once the panning is completed this is the current behavior. However we have achieved your requirement in the live sample, we have shared it below for your reference. You can refer this live sample and achieve your requirements.Live sample demo: https://flutter.syncfusion.com/#/cartesian-charts/user-interactions/auto-scrollingUG Link: https://help.syncfusion.com/flutter/cartesian-charts/axis-customization#auto-scrollingAdditionally based on the provided code snippet we suspect that you’re not using the latest chart version. As we have made chart performance improvements in the Volume 4, 2023 release. As part of this, we have made some changes. Please find the breaking and nullability enhancement changes below.Release notes - https://help.syncfusion.com/flutter/release-notes/v24.1.41?type=allKB - https://support.syncfusion.com/en-US/kb/article/14642/release-v24141---nullability-enhancementsOur chart version is compatible with Flutter SDK version 3.22.3; therefore, we kindly request that you upgrade the syncfusion_flutter_charts package to the latest version below.Version: https://pub.dev/packages/syncfusion_flutter_charts/versions/26.2.8Regards,Preethika Selvam.

Mateusz Kopacz · Answer

Dear Preethika,Thank you for your prompt response and your willingness to assist.In our implementation, we haven't utilized autoScrollingDelta. However, the current behavior we're experiencing, similar to what we observe in your live demo, is that after end of scrolling, the chart automatically snaps back to the end to display the newest data. Unfortunately, this doesn't meet our requirements.It is crucial for us to allow users to view the latest data while simultaneously enabling them to scroll back and see historical data, even as new data continues to be generated in the background.We would greatly appreciate your guidance on how to achieve the expected behavior.Thank you for your support.Best regards,Mateusz Kopacz

Preethika Selvam · Answer

Hi Mateusz,According to our current implementation when we use a autoScrollingDelta, and doing live update simultaneously, the chart will scroll to the end automatically to view the current data once the panning is completed this is the current behavior we have mentioned it in the live sample. We have shared it for your reference. Since the demand for this feature is currently low, we do not have plans to implement this.Live sample: https://flutter.syncfusion.com/#/cartesian-charts/user-interactions/auto-scrollingRegards,Preethika Selvam.