33+ chart types from the D3.js creators. Built-in transforms (group, bin, stack, facet...) auto-aggregate your data. Maps, dark mode, PNG/SVG/clipboard export, fully keyboard-accessible & customizable.
This plugin wraps Observable Plot, the high-level viz library built by the same team as D3.js. Its trademark is simple: it does the right thing by default. Time behaves like time, numbers behave like numbers, axes appear where they should, and your chart emerges from raw data with very little configuration.
Test in Demo App ·
See in Bubble Editor ·
Full user documentation ·
Observable Plot gallery
Our unfair advantage: built-in data transformsMost chart plugins expect data you've already shaped. If you want a histogram, a moving average, or a 100%-stacked view, you end up pre-computing it in backend workflows and storing it in helper fields.
Observable Plot flips that model: feed it raw rows, pick a
transform, and the aggregation happens at render time.
Transform
| What it does
| Example use case
|
Group
| Aggregate rows by category (sum, mean, median, count, min, max…)
| Revenue by country, avg order value by product
|
Bin
| Bucket numeric or date values into equal-width bins
| Histogram of order amounts, age distribution
|
Stack
| Cumulative positions for stacked bars, areas, streamgraphs
| Revenue by category over time
|
Normalize
| Express stacked values as percentages summing to 100%
| Market share evolution, 100% stacked bar
|
Window
| Moving average or rolling sum over a time series
| 7-day smoothed metrics, MA20 / MA50 financial charts
|
Hexbin
| Aggregate 2D scatter points into hexagonal density bins
| Density heatmap from thousands of points
|
Combine transforms with
faceting (automatic small multiples: one chart per category, arranged in a grid) and you build in one element what would otherwise need a dozen searches and custom workflows.
33 chart types, same set of fieldsCore: Line, Area, Stacked Area, Bar (Vertical / Horizontal), Stacked Bar, Grouped Bar, Dot / Scatter, Pie / Donut.
Statistical: Histogram, Box Plot, Density, Heatmap, Linear Regression, Bollinger Bands, Difference.
Specialized: Candlestick / OHLC, Radar / Spider, Waffle, Funnel, Gauge, KPI Card, Waterfall, Calendar Heatmap, Tree, Contour, Hexbin.
Annotation: Rule (reference line), Text Labels, Tick, Arrow, Vector.
Plus an Auto Chart mode that automatically picks the right visualization for your data, and a separate Plot Geo Map element (16 projections, any GeoJSON source).
Every chart type shares the same fields (X Values, Y Values, Series, Color Values, Transform, Aggregate Function). Switching types is a dropdown change.
11 extra recipes, same primitivesBecause transforms, stacking and faceting compose, you can build 11 additional styles by combining fields. All documented in the user guide: Diverging Stacked Bar (Likert scales), 100% Stacked Bar / Area, Streamgraph, Moving Average, Multi-Line, Temporal Bar, Correlation Heatmap, Warming Stripes, Stacked Histogram, Band Chart, Connected Scatterplot.
Built for productionAccessibility (A11Y), first-class. Full keyboard navigation (Tab, arrow keys, Home / End, Enter, Escape), ARIA labels on every data point, live screen reader announcements, WCAG-AA color contrast in light and dark mode. Your app stays usable for every visitor, compliant with ADA, Section 508, and the European Accessibility Act, and public-sector procurement rules.
Dynamic bindings everywhere. Every property (chart type, color scheme, projection, transform, aggregate, axis options) has a Dynamic override. Wire it to a dropdown, a user preference or a database field, and let your users pick what they want to see.
Polished defaults. 50 color schemes (categorical, sequential, diverging, cyclical). Automatic margins, so long labels never clip. Smart number formatting (42000 -> 42K, 1500000 -> 1.5M). Responsive sizing, from 200px mobile widget to full-page dashboard.
Smart gradient logic. Pair any sequential palette (Blues, Viridis, Spectral) with a chart and the biggest value automatically gets the darkest shade. Bar, waffle and grouped bar axes are reordered by magnitude so the gradient reads naturally. Override with Sort X or Custom Colors whenever you want manual control.
Next-gen KPI Card. A direction-aware trend arrow that flips color when the metric is “Lower is better” (churn, CAC, error rate) so a rise reads red instead of green. Optional target with a progress bar that inverts for lower-is-better metrics. Status thresholds that color the number itself green / amber / red. Icon slot for instant recognition on multi-card dashboards. Click anywhere on the card to trigger a workflow.
Finance-grade Candlestick / OHLC. Full OHLC bodies with configurable bullish / bearish colors (Western default, or flip to Asian convention where red is up). Volume bars beneath the candles, colored to match each candle. Overlay Moving Averages (MA20, MA50, MA200), Exponential Moving Averages (EMA12, EMA26), or Bollinger Bands on top. Rich tooltips with Open / High / Low / Close / Volume. Configurable time granularity (1m, 5m, 15m, 1h, 1d…) so one element handles intraday and daily charts alike.
Advanced Radar / Spider charts. Auto-normalize, raw, or percentile scales (compare price in $, mileage in mpg, and safety score on a single readable radar). Circular or polygonal grid, configurable start angle, smooth or straight curves. Small-multiples faceting produces one radar per category (one per quarter, one per product, one per department) arranged in a grid, automatically.
Plot Geo Map element. Separate element dedicated to maps. 16 projections: Mercator, Albers, Equal Earth, Natural Earth, Orthographic (3D globe), Identity (for floor plans and custom coordinate systems), and more. Auto TopoJSON / GeoJSON detection; feed it any URL. Bind values to polygons for choropleths, publish feature IDs and values on click.
Faceting / small multiples. Turn any chart into a grid of per-category sub-charts with one field (Facet By). Compare quarters, regions, or cohorts side by side without duplicating elements.
Dark mode. With background color customizable.
Export. One-click PNG, SVG and Copy to Clipboard actions. Title, subtitle, legend and caption all included in the file, at any resolution.
Interactive legends. Click a swatch to hide a series, shift-click to solo, double-click to reset. Hidden state is published to your Bubble workflows.
Events and states. Every chart publishes the full data point on click, hover and keyboard focus. Geo Map publishes feature IDs and values. Build drill-downs and cross-filter dashboards natively.
Actionable error messages. Every field is validated before render. If a chart fails, you get a clear message pointing to the field that needs attention, not a blank element.
Zero commercial license fees. Built on Observable Plot (ISC), D3.js (ISC), TopoJSON client (ISC) and html-to-image (MIT). All permissive open-source.
Documentation and supportWe wrote the documentation we wish every Bubble plugin had. Support requests are answered 7 days a week; we happily take any improvement request.
See full documentation herePlus, the plugin ships with a context document designed to be pasted into Claude, ChatGPT, Gemini, Copilot, or any LLM. Once pasted, your AI assistant knows every field, state, event, transform and common pitfall of the plugin, so it can write your Bubble expressions, diagnose a misbehaving chart, or suggest the right transform without guessing. Drop-in context for the AI workflow you already use.
Try risk-freeThe monthly subscription is prorated by the day. Try it for a few days, and if it is not the right fit, cancel and pay only for the days you used.
Please note we are not affiliated with Observable, Inc.