Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

SfCartesianChart - updateDataSource not working as intended #871

Open
servetoz opened this issue Oct 6, 2024 · 1 comment
Open

SfCartesianChart - updateDataSource not working as intended #871

servetoz opened this issue Oct 6, 2024 · 1 comment
Labels
charts Charts component waiting for customer Cannot make further progress until the customer responds

Comments

@servetoz
Copy link

servetoz commented Oct 6, 2024

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
@VijayakumarMariappan VijayakumarMariappan added charts Charts component open Open and need to address labels Oct 8, 2024
@Kaviyarasansf4298
Copy link

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.

@LavanyaGowtham2021 LavanyaGowtham2021 added waiting for customer Cannot make further progress until the customer responds and removed open Open and need to address labels Oct 10, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
charts Charts component waiting for customer Cannot make further progress until the customer responds
Projects
None yet
Development

No branches or pull requests

4 participants