SfCartesianChart: horizontal scroll

[dimzeta]

Hello, thank you for your incredible packges!

I have a SfCartesianChart with a lot of data to display, and I want to display only a part and being able to scroll horizontally. My issue is all the datas are displayed on the first time instead a part only.
I can have the expected result after having zooming in only.

Expected result:

Actual result:

My code:

import 'package:flutter/material.dart';
import 'package:syncfusion_flutter_charts/charts.dart';

class StatsChartWidget extends StatelessWidget {
  final List<Map<String, dynamic>> items;
  final Color color;

  const StatsChartWidget({
    super.key,
    required this.items,
    required this.color,
  });

  @override
  Widget build(BuildContext context) {
    return SfCartesianChart(
      enableAxisAnimation: true,
      plotAreaBorderWidth: 0,
      margin: EdgeInsets.zero,
      zoomPanBehavior: ZoomPanBehavior(
        enablePinching: true,
        enablePanning: true,
        zoomMode: ZoomMode.x,
      ),
      primaryXAxis: DateTimeAxis(
        enableAutoIntervalOnZooming: true,
        axisLine: const AxisLine(color: Colors.transparent),
        majorGridLines: const MajorGridLines(width: 0),
        majorTickLines: const MajorTickLines(width: 0),
      ),
      primaryYAxis: NumericAxis(
        isVisible: false,
        majorGridLines: const MajorGridLines(width: 0),
        majorTickLines: const MajorTickLines(width: 0),
      ),
      series: <SplineAreaSeries<dynamic, DateTime>>[
        SplineAreaSeries<dynamic, DateTime>(
          dataSource: items,
          xValueMapper: (dynamic data, _) => data['date'],
          yValueMapper: (dynamic data, _) => data['value'],
          markerSettings: MarkerSettings(
            isVisible: true,
            color: color,
            borderColor: Colors.white,
            borderWidth: 1,
            width: 8,
            height: 8,
          ),
          borderWidth: 2,
          borderColor: color,
          borderDrawMode: BorderDrawMode.top,
          gradient: LinearGradient(
            colors: <Color>[
              color.withOpacity(0.25),
              color.withOpacity(0),
            ],
            stops: const <double>[0.25, 0.8],
            begin: Alignment.topCenter,
            end: Alignment.bottomCenter,
          ),
        ),
      ],
    );
  }
}

Thank you for your help !

[dimzeta]

I finally did it using visibleMinimum and visibleMaximum properties in primaryXAxis.