Skip to content
Blog

Interactive Charts in Flutter with Syncfusion Flutter Charts

Build interactive line, column, spline, pie and spark charts with syncfusion_flutter_charts 35.1.43, SfCartesianChart series, ChartSeriesController, and its license terms.

Published on • November 5, 2026

AI Assistant

Dashboard screens are where most Flutter chart libraries reveal their limits: a CustomPainter that draws a line is easy, but trackballs, zoomable date axes, collapsible legends and live data updates are weeks of work. syncfusion_flutter_charts ships all of that out of the box — version 35.1.43, published November 2026, supporting Android, iOS, Linux, macOS, web and Windows.

The trade-off is licensing: this is a commercial package, and you need either a paid Syncfusion license or the free Community License.

The chart family

One import covers the cartesian charts, a second covers sparklines:

import 'package:syncfusion_flutter_charts/charts.dart';
import 'package:syncfusion_flutter_charts/sparkcharts.dart';

SfCartesianChart renders line, spline, area, column, bar, bubble, scatter, step line, fast line, range column, range area, candle, hilo, ohlc, histogram, waterfall and the stacked/100% stacked variants — Syncfusion counts 30+ chart types in total. SfCircularChart covers pie, doughnut and radial bar; SfPyramidChart and SfFunnelChart handle those two shapes; and the sparkline family (SfSparkLineChart, SfSparkAreaChart, SfSparkBarChart, SfSparkWinLossChart) draws micro charts for tight spaces.

Series, mappers, and axes

Data is bound declaratively through generic series. Each series takes a dataSource plus xValueMapper/yValueMapper closures, and the axis type is chosen on the chart:

SfCartesianChart(
  primaryXAxis: CategoryAxis(),      // or DateTimeAxis(), NumericAxis(), LogAxis()
  title: ChartTitle(text: 'Half yearly sales'),
  legend: Legend(isVisible: true),
  tooltipBehavior: TooltipBehavior(enable: true),
  series: <LineSeries<SalesData, String>>[
    LineSeries<SalesData, String>(
      dataSource: salesData,
      xValueMapper: (d, _) => d.month,
      yValueMapper: (d, _) => d.total,
      dataLabelSettings: const DataLabelSettings(isVisible: true),
    ),
  ],
)

The package documentation lists numeric, category, date-time, date-time category and log axis types, so a time series gets proper date intervals and labels rather than formatted strings. For categorical data, CategoryAxis plus a String x-type is the common pairing; a date-time axis wants DateTime values from the mapper.

Interaction: trackball, zoom, selection, tooltip

The feature list on the pub page is where this package earns its keep: zooming and panning, crosshair, trackball, selection, tooltips, callbacks and auto-scrolling, plus a legend that can wrap, scroll and collapse series on tap. Most of these are single properties:

SfCartesianChart(
  trackballBehavior: TrackballBehavior(
    enable: true,
    activationMode: ActivationMode.singleTap,
  ),
  zoomPanBehavior: ZoomPanBehavior(
    enablePinching: true,
    enablePanning: true,
    enableDoubleTapZooming: true,
  ),
  selectionBehavior: SelectionBehavior(enable: true),
  series: <ColumnSeries<SalesData, String>>[ /* ... */ ],
)

Sparklines expose the same ideas in miniature — SparkChartTrackball, SparkChartMarker, SparkChartLabelDisplayMode and plot bands for highlighting a vertical range.

Updating live data with ChartSeriesController

Hold a reference to the controller to animate, toggle visibility or patch data without rebuilding the whole chart:

ChartSeriesController<SalesData, String>? _controller;

// On a new data point:
_controller?.updateDataSource(addedDataIndexes: [salesData.length - 1]);

// Toggle a series or replay its entrance animation:
_controller?.isVisible = true;
_controller?.animate();

ChartSeriesController also offers pixelToPoint(Offset) and pointToPixel(CartesianChartPoint) for hit-testing your own gestures, and notifyVisibleListeners() for visibility observers. Because updateDataSource processes only the added, updated or removed indexes instead of the full list, it is the right call for a stream of live ticks.

Licensing: Community vs commercial

The pub page carries an explicit disclaimer: this is a commercial package, and you need either a Syncfusion Commercial License or the free Syncfusion Community License. The Community License is free while you remain eligible — companies and individuals with less than $1 million USD annual gross revenue, 5 or fewer developers, and 10 or fewer total employees, and entities that have never received more than $3,000,000 USD in outside capital. It can be used to build commercial applications, but governments funded by tax dollars are not eligible, and open-source use requires registering with Syncfusion first. Once you outgrow the thresholds, you move to a paid license.

Syncfusion or fl_chart?

fl_chart 1.3.0 (published October 2026, MIT) is the mainstream open-source alternative: line, bar, pie, scatter and radar charts, plus candlestick, with the same six-platform support and zero licensing review. It is highly customizable and cheap to adopt, but the interaction layer — trackball, zoom/pan, date-axis intelligence, live series patching — is thinner and often hand-assembled.

Pick fl_chart for static-to-moderate charts inside a MIT-only dependency budget. Pick Syncfusion when the brief says financial-grade interactivity, dozens of chart types, or sparklines everywhere — and confirm your headcount and revenue fit the Community License before the code is written.

Takeaway: syncfusion_flutter_charts 35.1.43 gives you SfCartesianChart with 30+ series types, date-time axes, trackball/zoom/selection and a controller for cheap live updates — powerful enough that the only real decision left is whether your team qualifies for the Community License or needs a commercial one.