SfCartesianChart - updateDataSource not working as intended

[servetoz]

Bug description

Hi,

I'm trying to plot real-time data comes from a sensor with updateDataSource method.
As in the provided code, I add and remove 1k new data points each second, so data count stays same.
However, as you can see in the video, newly added data is not being drawn and after couple of seconds the graph becomes empty.

Thanks.

Steps to reproduce

1. Run provided code.

Code sample

Code sample

void main() {
  runApp(const MainApp());
}

class MainApp extends StatefulWidget {
  const MainApp({super.key});

  @override
  State<MainApp> createState() => _MainAppState();
}

class _MainAppState extends State<MainApp> {
  late List<ChartSampleData> _chartData;
  late ChartSeriesController _seriesController;
  late Random _random;
  int _index = 0;
  Timer? timer;

  @override
  void initState() {
    super.initState();
    _random = Random();
    _chartData = <ChartSampleData>[];
    for (int i = 0; i < 10000; i++) {
      _chartData.add(
        ChartSampleData(
          x: _index,
          y: _random.nextInt(1000),
        ),
      );
      _index++;
    }
    Timer.periodic(const Duration(milliseconds: 1000), _updateDataSource);
  }

  void _updateDataSource(Timer timer) {
    // if (_chartData.length > 124000) {
    //   _chartData.clear();
    //   _targetValue = 3000;
    //   _index = 0;
    // }
    for (int i = 0; i < 1000; i++) {
      _chartData.removeAt(0);
      _chartData.add(
        ChartSampleData(
          x: _index,
          y: _random.nextInt(1000),
        ),
      );
    }
    _seriesController.updateDataSource(addedDataIndexes: _getIndexes(1000), removedDataIndexes: List.generate(1000, (index) => index));
    print('Data length: ${_chartData.length} added: ${_getIndexes(10)} removed: ${List.generate(10, (index) => index)}');
  }

  List<int> _getIndexes(int length) {
    final int startIndex = _chartData.length - length;
    final List<int> indexes = List.generate(length, (index) => startIndex + index);
    return indexes;
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: SfCartesianChart(
          primaryXAxis: NumericAxis(),
          primaryYAxis: NumericAxis(),
          series: <CartesianSeries<ChartSampleData, num>>[
            FastLineSeries<ChartSampleData, num>(
              dataSource: _chartData,
              xValueMapper: (ChartSampleData data, _) => data.x,
              yValueMapper: (ChartSampleData data, _) => data.y,
              onRendererCreated: (ChartSeriesController controller) {
                _seriesController = controller;
              },
              color: Colors.accents[_random.nextInt(14)],
            ),
          ],
        ),
      ),
    );
  }
}

class ChartSampleData {
  final num? x;
  final num? y;
  ChartSampleData({
    required this.x,
    required this.y,
  });
}

Screenshots or Video

Screenshots / Video demonstration

Screen_Recording_20241006_093846.mp4

Stack Traces

Stack Traces

No error.
Console log: [12]
I/flutter (18061): Data length: 10000 added: [9990, 9991, 9992, 9993, 9994, 9995, 9996, 9997, 9998, 9999] removed: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]

On which target platforms have you observed this bug?

Android

Flutter Doctor output

Doctor output

[√] Flutter (Channel stable, 3.24.0, on Microsoft Windows [Version 10.0.22621.4169], locale de-DE)
    • Flutter version 3.24.0 on channel stable at C:\flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 80c2e84975 (10 weeks ago), 2024-07-30 23:06:49 +0700
    • Engine revision b8800d88be
    • Dart version 3.5.0
    • DevTools version 2.37.2

[√] Windows Version (Installed version of Windows is version 10 or higher)

[√] Android toolchain - develop for Android devices (Android SDK version 35.0.0)
    • Android SDK at C:\Users\servet\AppData\Local\Android\sdk
    • Platform android-35, build-tools 35.0.0
    • Java binary at: C:\Program Files\Android\Android Studio\jbr\bin\java
    • Java version OpenJDK Runtime Environment (build 17.0.11+0--11852314)
    • All Android licenses accepted.

[√] Android Studio (version 2024.1)
    • Android Studio at C:\Program Files\Android\Android Studio
    • Flutter plugin can be installed from:
       https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
       https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 17.0.11+0--11852314)

[√] VS Code (version 1.94.0)
    • VS Code at C:\Users\servet\AppData\Local\Programs\Microsoft VS Code
    • Flutter extension version 3.98.0

[√] Connected device (1 available)
    • SM S916B (mobile) • IP • android-arm64 • Android 14 (API 34)

[√] Network resources
    • All expected network resources are available

[Kaviyarasansf4298]

Hi @servetoz ,

We have validated your sample, and we can confirm that the mentioned behavior is replicated on our side when using the addedDataIndexes and removedDataIndexes of the updateDataSource method with a large set of data points. This occurs because the data points stored in the data source have been removed, resulting in an empty data source and therefore the series has not been displayed.

However, we recommend that you use the updatedDataIndexes argument of the updateDataSource method instead of adding and then removing them using both the addedDataIndexes and removedDataIndexes arguments. By using this updatedDataIndexes, you can update or modify the data source of the chart based on the indexes directly in the chart.

If you have any further questions or need assistance with other features, please don’t hesitate to reach out.

Sample: gh_871.zip

Regards,
Kaviyarasan Arumugam.