1. Feedback
  2. Flutter
  3. 28134

Welcome to the Flutter feedback portal. We’re happy you’re here! If you have feedback on how to improve the Flutter, we’d love to hear it!

  • Check out the features or bugs others have reported and vote on your favorites. Feedback will be prioritized based on popularity.
  • If you have feedback that’s not listed yet, submit your own.

Thanks for joining our community and helping improve Syncfusion products!

1
Vote

Candle series range not being updated on load when a zoom factor is set

I have a cartesian chart with a candle series, I'm setting a default zoom factor in the corresponding X Axis, when the chart first loads the Y Axis range doesn't take into account the zoom factor, but once I zoom or pan it the range is correctly adjusted, this can be seen in the linked video.

Video: 

https://drive.google.com/file/d/1Qgey3glGp8IlzWXseQxQ73_tjoGknBOu/view

This is my relevant code:

double zoomFactor =
  candles.isNotEmpty 
  ? (20 / candles.length).clamp(0.0, 1.0) 
  : 1.0;
return SfCartesianChart(
  primaryXAxis: DateTimeAxis(
    name: 'date_axis',
    dateFormat: DateFormat.Md().add_Hm(),
    majorGridLines: const MajorGridLines(width: 0),
    zoomFactor: zoomFactor,
    zoomPosition: 1 - zoomFactor,
    axisLine: AxisLine(
      width: 1,
      color: Get.theme.dividerColor.withOpacity(0.5),
    ),
  primaryYAxis: NumericAxis(
    name: 'currency_axis',
    numberFormat: compactUsdCurrencyFormatter,
    opposedPosition: true,
    rangePadding: ChartRangePadding.round,
    labelPosition: ChartDataLabelPosition.inside,
    axisLine: const AxisLine(width: 0),
    majorTickLines: const MajorTickLines(width: 0),
    majorGridLines: MajorGridLines(
      color: Get.theme.dividerColor.withOpacity(0.5),
      width: 1,
    ),
  ),
  series: [
    CandleSeries(
      name: 'Candles',
      dataSource: candles,
      xValueMapper: (candle, index) => candle.date,
      lowValueMapper: (candle, index) => candle.low,
      highValueMapper: (candle, index) => candle.high,
      openValueMapper: (candle, index) => candle.open,
      closeValueMapper: (candle, index) => candle.close,
      bullColor: ColorUtils.bullColor,
      bearColor: ColorUtils.bearColor,
      enableSolidCandles: true,
      borderWidth: 1,
      xAxisName: 'date_axis',
      yAxisName: 'currency_axis',
    ),
  ],
  zoomPanBehavior: ZoomPanBehavior(
    enablePinching: true,
    enablePanning: true,
    zoomMode: ZoomMode.x,
    maximumZoomLevel: zoomFactor / 5,
  ),
);