From Zero to Multiplatform: Building a Charts Library in 15 Days
summary
Claims a working, production chart library built with Compose Multiplatform and compiled to WebAssembly using Skia via Skiko, delivered across Android, iOS and Web; implements ~10 chart components with 20+ customization parameters, supports heatmaps, combined and double‑axis charts, resizable canvases and tooltips. Solves text measurement and label rotation by premeasuring, and prevents browser crashes from WebGL limits (~16 contexts) with a dispose/fallback strategy; deployed to clients (Chobani, FIFA, Kimberly‑Clark).
AI-written summary · about
chapters (22)
- 0:00Multiplatform charts project intro
- 1:04Data platform and chart needs
- 4:13Mobile app and Compose choice
- 6:18Compose Multiplatform overview
- 7:42Need for custom chart library
- 10:12Kotlin for cross-platform
- 11:14Canvas and chart rendering basics
- 13:02DrawBehind performance benefits
- 15:49Bar charts with canvas
- 17:57Complex charts: donut and box plots
- 18:40Text measurement and styling issues
- 20:50Text layout and rotation optimizations
- 22:17Mobile launch and client adoption
- 22:58Web deployment challenges
- 24:25Web rendering with Skia
- 26:27WebGL context and memory issues
- 28:40WebGL limits in browsers
- 30:28Fixing WebGL disposal problems
- 31:51Demo: mobile and web
- 35:45Layout customization and plans
- 36:47Open-sourcing library
- 38:35Q&A
related talks
06mCross-Platform Data Visualization with React and React Native
37mMaking Data Visualizations More Accessible - Lessons Learned
20mIntro to LayerChart
06mSubdivide: Cross-platform charting with React & React Native
32mCharming Swift Charts
33mPainting with Data
15mThe Future of Data Visualization on the Web
44mUsing our Graphics Library to show them analytics!