If you've ever tried to build decent data visualizations in Flutter, you know the pain. You either get stuck with basic chart widgets that look like they're from 2010, or you end up embedding web views just to use D3.js. Neither feels great.
As someone who has a CS degree focused on data analytics, I spent way too much time fighting with fl_chart and charts_flutter. They're fine for simple stuff, but the moment you need anything remotely sophisticated, you're out of luck.
Don't get me wrong - those libraries serve their purpose. But when you need dual y-axes, custom interactions, or anything beyond basic bar/line charts, you're basically SOL.
So I built Cristalyse.
What's different about it?
It's based on grammar of graphics (think ggplot2 if you've used R). Instead of rigid chart widgets, you build visualizations by layering data, mappings, and geometries.
Here's what a scatter plot looks like:
CristalyseChart()
.data([
{'x': 1, 'y': 2, 'category': 'A'},
{'x': 2, 'y': 4, 'category': 'B'},
{'x': 3, 'y': 1, 'category': 'A'},
])
.mapping(x: 'x', y: 'y', color: 'category')
.geomPoint(size: 5.0, alpha: 0.7)
.scaleXContinuous()
.scaleYContinuous()
.theme(ChartTheme.defaultTheme())
.build()
Compare that to the usual Flutter chart setup where you're passing in a dozen different widget properties and hoping for the best.
Actually useful features
The stuff I was missing in other libraries:
Dual Y-axis support - Because sometimes you need to plot revenue and user count on the same chart without everything looking broken. Most Flutter chart libraries either don't support this or make it incredibly painful.
Proper animations - 60fps smooth transitions that leverage Flutter's rendering engine. Not the janky CSS-style animations you get with web-based solutions.
Real theming - Change colors, fonts, spacing, grid styles, whatever. No more "this chart library only supports 5 preset themes" nonsense.
SVG export - For when your PM asks for "just a quick chart for the presentation" (we've all been there). Works across all platforms.
Interactive tooltips - Hover states that actually work and look professional. Pan and zoom that feels natural.
Multiple geometries - Layer different chart types on the same plot. Scatter plots with trend lines, bar charts with reference lines, whatever makes sense for your data.
Real world example
Here's something I built recently - a dashboard showing user engagement over time with conversion events overlaid:
CristalyseChart()
.data(analyticsData)
.mapping(x: 'date', y: 'activeUsers')
.mappingY2('conversions')
.geomLine(
yAxis: YAxis.primary,
strokeWidth: 2.0,
color: Colors.blue,
)
.geomPoint(
yAxis: YAxis.secondary,
color: Colors.red,
size: 8.0,
)
.scaleXContinuous()
.scaleYContinuous(min: 0)
.scaleY2Continuous(min: 0)
.theme(ChartTheme.defaultTheme())
.build()
Try doing that cleanly with fl_chart. I'll wait.
Performance that doesn't suck
I benchmarked this against the popular Flutter chart libraries with a dataset of 10k points. Cristalyse consistently outperformed them, especially on animations and interactions. The secret sauce is leveraging Flutter's CustomPainter directly instead of building complex widget trees.
Plus, since it's not web-based, you don't get the typical "works great in Chrome, terrible everywhere else" experience.
Cross-platform without the headaches
The best part? It works everywhere Flutter works. Mobile, web, desktop, all from the same code. No platform-specific chart libraries, no "oh this doesn't work on web" surprises.
I've been using it for dashboards in my own projects and it's been solid. The performance is actually better than the web-based solutions because it's using Flutter's rendering engine instead of fighting with DOM manipulation.
Why grammar of graphics matters
If you've never used ggplot2 or similar libraries, the grammar of graphics approach might seem weird at first. But it's incredibly powerful once it clicks.
Instead of having separate widgets for LineChart, BarChart, ScatterPlot, etc., you have one Chart widget that you compose different layers onto. Want a scatter plot with a trend line? Add both geomPoint() and geomSmooth(). Want to color code by category? Map a column to the color aesthetic.
This composability means you can create complex visualizations that would be impossible (or really ugly) with traditional chart widgets.
The technical stuff
Under the hood, Cristalyse uses Flutter's CustomPainter for rendering, which gives us direct access to the canvas. This means:
- Better performance than widget-heavy approaches
- Smooth animations using Flutter's animation framework
- Consistent rendering across all platforms
- Easy integration with Flutter's existing theming system
The data processing pipeline handles missing values gracefully, supports different data types (numeric, categorical, datetime), and includes basic statistical transformations out of the box.
Try it out
It's on pub.dev as cristalyse. Check out cristalyse.com for examples and getting started info, or jump straight to the full documentation at docs.cristalyse.com with interactive examples and a proper quickstart guide.
The docs site has live code examples you can copy-paste, plus a gallery of different chart types with complete source code.
Fair warning: it's still early days (version 0.9.3), so expect some rough edges. But it's functional enough that I'm using it in production for client projects.
What's next
Working on a few things for the next release:
- Histogram and density plots
- Better mobile touch interactions
- More statistical transformations (smoothing, regression lines)
- Faceting support for small multiples
- Better integration with common Flutter state management patterns
If you've been frustrated with Flutter's chart situation, give it a shot. The GitHub repo is open for issues, feature requests, or if you want to contribute.
Built this because I needed it, figured others might too. Source is on GitHub if you want to poke around or contribute.
Top comments (2)
Thank you for building Cristalyse!
I've tried it out and integrated it in a few of my projects already, it's the best charts library for flutter I found so far!
this is the kind of comments that make everything worth it. thank you for saying that and trying it out, i'll continue to make it better almost every day 🙌