Gesture issue when panning enabled SfCartesianChart is putted in LayoutBuilder

[tlserver]

I found that the panning gesture cannot be handled so well when the chart is putted in LayoutBuilder. It works well if LayoutBuilder is removed.

Example:

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

class Datum {
  double y;
  DateTime x;

  Datum({
    this.x,
    this.y,
  });
}

List<Datum> data = [
  Datum(x: DateTime(2019, 8, 1), y: 20.1),
  Datum(x: DateTime(2019, 8, 3), y: 14.5),
  Datum(x: DateTime(2019, 8, 4), y: 17.7),
  Datum(x: DateTime(2019, 8, 5), y: 31.3),
  Datum(x: DateTime(2019, 8, 6), y: 12.8),
];

class TestPage extends StatefulWidget {
  @override
  _TestPageState createState() => _TestPageState();
}

class _TestPageState extends State<TestPage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
//      body: chart(),
      body: LayoutBuilder(
        builder: (BuildContext context, BoxConstraints constraints) {
          return chart();
        },
      ),
    );
  }
}

SfCartesianChart chart() {
  return SfCartesianChart(
    series: [
      SplineSeries<Datum, DateTime>(
        dataSource: data,
        xValueMapper: (Datum datum, int index) => datum.x,
        yValueMapper: (Datum datum, int index) => datum.y,
        markerSettings: MarkerSettings(
          isVisible: true,
        ),
      ),
    ],
    primaryXAxis: DateTimeAxis(
      zoomPosition: 1,
      zoomFactor: 0.25,
    ),
    zoomPanBehavior: ZoomPanBehavior(
      enablePanning: true,
      zoomMode: ZoomMode.x,
    ),
  );
}

[dharanidharandharmasivam]

Hi @tlserver ,

Thanks for trying our Syncfusion Flutter chart widget. We have fixed the reported issue, now the chart can be panned smoothly when the chart widget is placed in the LayoutBuilder widget. To resolve the issue, kindly upgrade your package and you can find the updated packages from the below link.

https://pub.dev/packages/syncfusion_flutter_charts

Kindly let us know if you have any concerns.

Thanks,
Dharani.

[JayavigneshwaranG]

Hi @tlserver ,

We are closing this issue now, as it is resolved.
If you still face any concerns, please create a support incident(https://www.syncfusion.com/support/directtrac/incidents/newincident) for better follow up, we will update the responses there.

Thanks,
Jayavigneshwaran

[tlserver]

I have upgraded the package to version 1.0.0-beta.4, but I still have the same problem when executing the example above. Please consider reopen this issue.

[dharanidharandharmasivam]

Hi @tlserver ,

Thanks for the revert. To the layout builder, you can specify the height and width to overcome the reported scenario. We have attached the code snippet that can be found below.

Widget build(BuildContext context) { return Scaffold( appBar: AppBar(), body: LayoutBuilder( builder: (BuildContext context, BoxConstraints constraints) { return Container( width: constraints.maxWidth, height: constraints.maxHeight, child: chart(), ); }, )); }

We have also attached sample for your reference.

Hope this helps.

Thanks,
Dharani.