syncfusion / flutter-widgets

Syncfusion Flutter widgets libraries include high quality UI widgets and file-format packages to help you create rich, high-quality applications for iOS, Android, and web from a single code base.
1.44k stars 672 forks source link

Tooltip pops up twice when tapping on a point that has overlapping lines in line chart #1849

Open shatanikmahanty opened 1 week ago

shatanikmahanty commented 1 week ago

Bug description

It happened for me on latest flutter stable channel. I tried syncfusion charts version from 25.1.39 up to the latest.

Overlapping line charts causes the tooltip to show up twice. I've also tried TooltipBehavior( enable: true, shared: true, ). But even using shared causes the same issue.

Although using ActivationMode.doubleTap or ActivationMode.longPress fixes this

Steps to reproduce

  1. Create a line chart with multiple lines
  2. Tap on a point where they overlap
  3. Tooltip pops up, disappears and then pops up again

Code sample

Code sample ```dart SfCartesianChart _buildDefaultLineChart(GrowthGraphBloc ggb) { return SfCartesianChart( plotAreaBorderWidth: 0, title: const ChartTitle(text: 'Growth Per Month', textStyle: TextStyle(color: Colors.white)), zoomPanBehavior: ZoomPanBehavior( enablePanning: true, ), legend: const Legend(isVisible: true, position: LegendPosition.top, textStyle: TextStyle(color: Colors.white)), primaryXAxis: const CategoryAxis( labelRotation: 45, interval: 1, labelStyle: TextStyle( color: Colors.white, fontSize: 12, ), majorGridLines: MajorGridLines(width: 0)), primaryYAxis: const NumericAxis( axisLine: AxisLine(width: 0), interval: 25, labelStyle: TextStyle(color: Colors.white, fontSize: 13), majorTickLines: MajorTickLines(color: Colors.transparent)), series: _getDefaultLineSeries(ggb), tooltipBehavior: TooltipBehavior( enable: true, ), ); } List> _getDefaultLineSeries(GrowthGraphBloc ggb) { return >[ LineSeries( animationDuration: 2500, dataSource: ggb.dataForGrowthGraph, xValueMapper: (ChartLineData sales, _) => sales.x, yValueMapper: (ChartLineData sales, _) => sales.y, width: 2, name: 'Reservations', markerSettings: const MarkerSettings(isVisible: true)), LineSeries( animationDuration: 2500, dataSource: ggb.dataForGrowthGraph, width: 2, name: 'Guests', xValueMapper: (ChartLineData sales, _) => sales.x, yValueMapper: (ChartLineData sales, _) => sales.y2, markerSettings: const MarkerSettings(isVisible: true)) ]; } ```

Screenshots or Video

Screenshots / Video demonstration https://github.com/syncfusion/flutter-widgets/assets/67138059/d972e374-992c-41a1-9fed-6b301a552475

Stack Traces

Stack Traces No errors or Stack Traces were generated

On which target platforms have you observed this bug?

Android

Flutter Doctor output

Doctor output ```console Doctor summary (to see all details, run flutter doctor -v): [√] Flutter (Channel stable, 3.19.6, on Microsoft Windows [Version 10.0.22631.3447], locale en-IN) [√] Windows Version (Installed version of Windows is version 10 or higher) [√] Android toolchain - develop for Android devices (Android SDK version 34.0.0) [√] Chrome - develop for the web [√] Visual Studio - develop Windows apps (Visual Studio Community 2022 17.9.6) [√] Android Studio (version 2023.3) [√] VS Code (version 1.89.0) [√] Connected device (4 available) [√] Network resources • No issues found! ```
PlusWong commented 1 week ago

I've got the same problem.And i found when series property length is 1,the problem is no more continue. anyone find solution?

LokeshPalani commented 1 week ago

Hi @PlusWong | @shatanikmahanty,

The reported issue is scheduled to be fixed in our upcoming weekly release which is scheduled on May 21, 2024. We have also shared root cause for your reference below. Thank you for your understanding and patience in the meantime.

Root cause: Tooltip was raised from both hover and tap callbacks, so it shows two times while having multiple series with same x and y position.

Regards, Lokesh P.