xAxis lable change in SplineArea chart when scroll horizontal.

[Khushbu]

I have implement SplineArea  chart with horizontal scrolling. when chart is load xAxis lable displayed correct but after scroll the chart all labels are changed. I have put this code:

               SfCartesianChart(
                           zoomPanBehavior: ZoomPanBehavior(
                                enablePanning: true, zoomMode: ZoomMode.x),
                            plotAreaBorderWidth: 0,
                            primaryXAxis: NumericAxis(
                                name: 'XAxis',
                                interval: 1,
                                visibleMinimum: 5,
                                visibleMaximum: 16,
                                numberFormat: NumberFormat.compact(),
                                decimalPlaces: 0,
                                labelIntersectAction:
                                    AxisLabelIntersectAction.hide,
                                minorGridLines: MinorGridLines(width: 0),
                                majorGridLines: MajorGridLines(width: 0),
                                labelFormat: 'W{value}',
                                labelStyle: TextStyle(
                                    color: grey,
                                    fontSize: 12.ssp,
                                    fontFamily: 'montserrat_regular'),
                            ),
                            primaryYAxis: NumericAxis(
                              axisLine: AxisLine(width: 0),
                              labelIntersectAction: AxisLabelIntersectAction.hide,
                              enableAutoIntervalOnZooming: false,
                              labelStyle: TextStyle(
                                  color: grey,
                                  fontSize: 12.ssp,
                                  fontFamily: 'montserrat_regular'),
                              majorGridLines: MajorGridLines(width: 0),
                              minorGridLines: MinorGridLines(width: 0),
                              majorTickLines: MajorTickLines(size: 0),
                            ),
                            series: _getSplieAreaSeries(),
                          ),

List<ChartSeries<Result, double>> _getSplieAreaSeries() {
  return <ChartSeries<Result, double>>[
    SplineAreaSeries<Result, double>(
      dataSource: result,
      color: orange.withOpacity(0.50),
      borderColor: orange,
      borderWidth: 4,
      xValueMapper: (Result sales, _) => double.parse(sales.weekNo),
      yValueMapper: (Result sales, _) => double.parse(sales.totalScore),
      onRendererCreated: (ChartSeriesController controller) {
        seriesController = controller;
      },
    ),
  ];
}
I also attached my result screen shots:

Attachment: device20210501124701_ea9f24df.zip

[Dharanitharan Palanisamy]

Hi Khushbu, 

 

Greetings from the team at Syncfusion. We have looked at your code and determined that it's occurring because the interval is being calculated based on the new range. We recommend that you disable the enableAutoIntervalOnZooming property in the respective axis to prevent the interval from being calculated for the new range and keep the old interval. 

Code Snippet 

primaryXAxis: NumericAxis( 

 enableAutoIntervalOnZooming: false, 

), 

Please revert us if you need further assistance on this. 

Thanks, 

Dharanitharan. P 

 

 

 

 

[Khushbu]

Hi,

This fixes my issue. Thank you very much for the help :) I appreciate the help from Syncfusion.

[Dharanitharan Palanisamy]

Hi Khushbu, 

 

Most welcome and thank you for your kind words. Please contact us if you need any additional assistance, and we will be pleased to assist you. 

 

Thanks, 

Dharanitharan. P