onDataLabelTapped It doesn't always understand tapping

[MatinEffati]

Bug description

I have a chart with a custom marker but when I call onTap sometimes worked but often does not work. I don't know how to fix it.

Steps to reproduce

.

Code sample

Code sample

class MoodAnalysis extends StatefulWidget {
  const MoodAnalysis({
    super.key,
    required this.theme,
    required this.moodStatisticModel,
    required this.onPointTap,
    required this.nextWeek,
    required this.lastWeek,
    required this.chartTitle,
  });

  final ThemeData theme;
  final List<MoodStatisticItem> moodStatisticModel;
  final void Function(DataLabelTapDetails)? onPointTap;
  final Function() nextWeek;
  final Function() lastWeek;
  final String chartTitle;

  @override
  State<MoodAnalysis> createState() => _MoodAnalysisState();
}

class _MoodAnalysisState extends State<MoodAnalysis> {
  @override
  Widget build(BuildContext context) {
    return Container(
      width: double.infinity,
      margin: const EdgeInsets.all(16),
      decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(12),
        color: AppColors.secondary,
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Padding(
            padding: const EdgeInsets.all(16.0),
            child: Text(
              'Mood analysis',
              style: widget.theme.textTheme.labelMedium!.copyWith(color: AppColors.hyperBlue),
            ),
          ),
          const SizedBox(height: 16),
          Row(
            children: [
              const SizedBox(width: 16),
              Expanded(
                child: Text(widget.chartTitle, style: widget.theme.textTheme.headlineLarge!.copyWith(fontSize: 14)),
              ),
              GestureDetector(
                onTap: widget.lastWeek,
                child: Container(
                  width: 24,
                  height: 24,
                  padding: const EdgeInsets.all(2),
                  decoration: BoxDecoration(color: Colors.grey.shade100, borderRadius: BorderRadius.circular(1000)),
                  child: const Icon(
                    Icons.arrow_back_ios_new_rounded,
                    size: 14,
                  ),
                ),
              ),
              const SizedBox(width: 8),
              GestureDetector(
                onTap: widget.nextWeek,
                child: Container(
                  width: 24,
                  height: 24,
                  padding: const EdgeInsets.all(2),
                  decoration: BoxDecoration(color: Colors.grey.shade100, borderRadius: BorderRadius.circular(1000)),
                  child: const Icon(
                    Icons.arrow_forward_ios_rounded,
                    size: 14,
                  ),
                ),
              ),
              const SizedBox(width: 16),
            ],
          ),
          const SizedBox(height: 16),
          Container(
            padding: const EdgeInsets.fromLTRB(0, 0, 0, 16),
            width: double.infinity,
            height: 250,
            child: SfCartesianChart(
              onDataLabelTapped: (DataLabelTapDetails details) {
                print('Data label tapped at index: ${details.pointIndex}');
                widget.onPointTap?.call(details);
              },
              plotAreaBorderWidth: 0,
              primaryXAxis: CategoryAxis(
                axisLine: const AxisLine(color: Colors.transparent),
                majorGridLines: const MajorGridLines(width: 0),
                labelStyle: widget.theme.textTheme.bodySmall!.copyWith(
                  fontWeight: FontWeight.w700,
                  fontSize: 10,
                ),
                majorTickLines: const MajorTickLines(width: 0),
              ),
              primaryYAxis: const NumericAxis(
                labelStyle: TextStyle(color: Colors.transparent),
                axisLine: AxisLine(color: Colors.transparent),
                majorTickLines: MajorTickLines(width: 0),
              ),
              series: [
                SplineSeries<MoodStatisticItem, String>(
                  dataSource: widget.moodStatisticModel,
                  markerSettings: const MarkerSettings(
                    isVisible: true,
                    height: 10,
                    width: 10,

                  ),
                  dataLabelSettings: DataLabelSettings(
                    isVisible: true,
                    labelAlignment: ChartDataLabelAlignment.top,
                    alignment: ChartAlignment.near,
                    builder: (data, point, series, pointIndex, seriesIndex) {
                      return data.mood != null
                          ? SizedBox(
                              height: 20,
                              width: 20,
                              child: Image.asset(
                                data.imageMood,
                                fit: BoxFit.fill,
                                width: 20,
                                height: 20,
                              ),
                            )
                          : const SizedBox();
                    },
                  ),
                  color: AppColors.light,
                  xValueMapper: (_, index) => widget.moodStatisticModel[index].weekDayName,
                  yValueMapper: (_, index) => widget.moodStatisticModel[index].point,
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}

Screenshots or Video

Screenshots / Video demonstration

Recording.2024-09-23.115933.mp4

Stack Traces

.

On which target platforms have you observed this bug?

Android, iOS, Web

Flutter Doctor output

Doctor output

[√] Flutter (Channel stable, 3.24.0, on Microsoft Windows [Version 10.0.22631.4169], locale en-US)
[√] Windows Version (Installed version of Windows is version 10 or higher)
[√] Android toolchain - develop for Android devices (Android SDK version 35.0.0)
[√] Chrome - develop for the web
[X] Visual Studio - develop Windows apps
    X Visual Studio not installed; this is necessary to develop Windows apps.
      Download at https://visualstudio.microsoft.com/downloads/.
      Please install the "Desktop development with C++" workload, including all of its default components
[√] Android Studio (version 2024.1)
[√] VS Code (version 1.91.1)
[√] Connected device (4 available)
[√] Network resources