Braven Charts #

Braven Charts is a native Flutter charting system for interactive, production-grade data visualization.

Render twelve chart families through one custom RenderBox and Canvas pipeline. Author charts directly, through the checked typed Grammar of Graphics API, or with fluent modifiers. Then add selection, tracking, live data, multi-axis analysis, generated source, tables, and portable artifacts without leaving Flutter's rendering system.

Open the live showcase · Choose a chart family · Browse documentation

Why Braven Charts #

Twelve chart families: Build Cartesian, financial, radial, and polar charts in one native renderer.
Interaction and selection: Zoom, pan, track, annotate, select, and manipulate durable interval brushes.
Multi-axis analysis: Coordinate independent axes, normalized series, navigators, and summaries.
Typed authoring and source: Choose direct config, checked Grammar, fluent modifiers, or generated Dart.
Live and efficient rendering: Stream changing data through cached, frame-coalesced rendering.
Product-ready chart surfaces: Add Chart, Data, Split, Source, tables, CSV, themes, and artifacts.

Choose a chart family #

Start with the question your data needs to answer. Every visual opens the exact runnable guide in the showcase; each guide includes curated presets and the relevant Chart, Data, Split, and Source views.

Line	Area

Time series, change over time, and analytical overlays Line chart family · Synchronized route profile Open all Line examples · Line guide	Volume, accumulated values, forecasts, and baseline comparison Area chart family · Value summary composition Open all Area examples · Area guide

Range Area	Bar

Low-high envelopes, confidence bands, and bounded ranges Range Area chart family · Temperature envelope Open all Range Area examples · Range Area guide	Grouped, stacked, range, waterfall, and ranked data Bar chart family · Waterfall bridge Open all Bar examples · Bar guide

Scatter	Candlestick

Correlation, cohorts, distributions, and independent encodings Scatter chart family · Market opportunity bubbles Open all Scatter examples · Scatter guide	Price action and interval-based financial observations Candlestick chart family · Market structure Open all Candlestick examples · Candlestick guide

Pie	Donut

Small categorical share datasets with one total Pie chart family · Revenue contribution Open all Pie examples · Pie guide	Part-to-whole data that benefits from a central value Donut chart family · Campaign reach Open all Donut examples · Donut guide

Concentric Donut	Polar Column / Rose

Comparing distributions across periods, cohorts, or groups Concentric Donut chart family · Service-level health Open all Concentric Donut examples · Concentric Donut guide	Cyclical categories and compact magnitude profiles Polar Column and Rose chart family · Lifecycle arc Open all Polar Column / Rose examples · Polar Column / Rose guide

Radial Bar	Gauge / Solid Gauge

Category progress, targets, signed baselines, and compact KPI tracks Radial Bar chart family · Signed baseline comparison Open all Radial Bar examples · Radial Bar guide	Operational state, targets, thresholds, zones, and compact KPI status Gauge and Solid Gauge family Open all Gauge / Solid Gauge examples · Gauge / Solid Gauge guide

Install #

dependencies:
  braven_charts: ^0.16.0

Then run flutter pub get.

Compatibility: Dart >=3.9.0 <4.0.0 and Flutter >=3.35.0.

Import the core package:

import 'package:braven_charts/braven_charts.dart';

Quick start #

Use immutable configuration for direct control:

Direct configuration #

class BasicLineChart extends StatelessWidget {
  const BasicLineChart({super.key});

  @override
  Widget build(BuildContext context) {
    return const SizedBox(
      height: 280,
      child: BravenChartPlus(
        title: 'Monthly revenue',
        series: [
          LineChartSeries(
            id: 'revenue',
            name: 'Revenue',
            points: [
              ChartDataPoint(x: 1, y: 42),
              ChartDataPoint(x: 2, y: 48),
              ChartDataPoint(x: 3, y: 45),
              ChartDataPoint(x: 4, y: 57),
              ChartDataPoint(x: 5, y: 63),
            ],
          ),
        ],
      ),
    );
  }
}

Typed Chart Grammar #

final basicGrammarChart = BravenChart.of(revenueSamples)
    .x(sampleMonth, label: 'Month')
    .y(sampleRevenue, label: 'Revenue')
    .geomLine(name: 'Revenue', showDataPointMarkers: true)
    .title('Monthly revenue')
    .build();

The Grammar example uses a typed revenueSamples list and named accessors. It lowers to the same BravenChartPlus renderer as direct configuration.

Grammar / Fluent API (Beta): The Grammar of Graphics and fluent modifier authoring layers are experimental and may change before a stable release. Pin a version if you depend on them. See Chart grammar and the fluent surface.

Continue with a runnable example:

Mobile touch interaction — Keep Browse surfaces scroll-first, move inspection to long press, or opt back into short-tap selection.
Multi-axis charts and normalization
Selection and linked brushing — Try the opt-in persistent X/Y brush, including initial bounds, styling, drag/resize, controller commands, and touch coexistence.
Live data and buffering
Chart, Data, Split, and Source Workbench
Portable artifacts, tables, and restoration

Documentation #

The documentation home organizes runnable examples, concept guides, recipes, and API reference by developer task.

Get started #

Build your first chart — Install the package and render a small, interactive line chart.
Author with Chart Grammar — Describe data accessors and marks through a checked typed chain.
Choose a chart family — Start with the data question and compare all built-in families.

Interaction and display #

Tracking and value display — Compose crosshairs, tooltips, markers, and persistent value summaries.
Mobile interaction — Keep scrolling natural, inspect with a hold, and opt into short-tap selection only where it fits.
Selection and linked brushing — Select points, ranges, categories, series, linked data, and persistent X/Y brushes.
Zoom, pan, and navigators — Control viewports directly or through a reusable full-domain navigator.
Annotations — Add and edit point, range, threshold, text, trend, and pin overlays.
Axes and normalization — Configure independent axes, visible slots, formatting, and normalization.
Themes and accessibility — Apply coherent light, dark, accessible, and product-specific chart themes.

Data, authoring, and live updates #

Typed Chart Grammar — Lower typed accessors, encodings, marks, and options to the standard renderer.
Generated Dart source — Capture a mounted chart and inspect checked Config or Grammar output.
Live data and buffering — Ingest changing data without rebuilding the widget tree for every sample.
Performance — Understand cached layers, spatial indexing, streaming, and large datasets.

Workbench, artifacts, and export #

Chart Workbench — Keep one chart mounted across Chart, Data, Split, and Source views.
Portable chart artifacts — Capture, validate, store, preview, hydrate, and restore effective chart state.
Data tables and CSV — Project chart data into exact tables with copy and raw-value CSV export.
Chart document comparison — Align saved chart documents without losing identity, units, or provenance.

API reference #

Generated API reference — Search public libraries, widgets, series, configuration, controllers, and members.
Public API overview — Review the supported public surface by capability.
Feature coverage matrix — Compare implemented behavior and public boundaries.