[NEW PLUGIN] VizBlocks & VizBlocks PRO - The Ultimate, Beautiful Charting Library for Bubble!

Hey bubblers! :waving_hand:

If you’re anything like me, you’ve probably spent hours trying to make native charts look good, or wrestled with heavy chart plugins that require you to write JSON just to change a color.

I wanted beautiful, responsive, SaaS-ready charts that work out of the box. So, I built VizBlocks. :bar_chart::sparkles:

VizBlocks brings the power of industry-leading visualization engines (ApexCharts, D3.js, Vis.js) into native, highly customizable Bubble elements. No coding, no JSON, just dynamic data lists and toggles!

We are launching with two versions today:

:green_circle: VizBlocks (FREE) Perfect for your everyday dashboard needs. Clean, animated, and fully responsive.

  • :chart_increasing: Line Charts (Smooth & Straight)

  • :bar_chart: Bar Charts (Vertical & Horizontal)

  • :doughnut: Donut & Pie Charts

  • Radar Charts

:gem_stone: VizBlocks PRO Built for complex analytics, SaaS dashboards, and advanced data storytelling.

  • Histogram (Auto-bins raw data and overlays a Bell Curve! :bell:)

  • Scatter Plot (With auto-calculated linear regression Trendlines :chart_decreasing:)

  • Multi-Series Dual Axis (Combine Bars and Lines with independent Y-axes)

  • Interactive Flow Charts (Physics-based, drag-and-drop nodes :spider_web:)

  • Radial Mind Maps (Expand/Collapse branches, powered by D3.js :brain:)

  • Word Clouds (Custom shapes like hearts and stars :cloud:)

  • Venn Diagrams (True mathematical overlaps)

  • Timelines, Process Lists, Funnels/Pyramids, Stacked Area Charts, and more!

:hammer_and_wrench: Why use VizBlocks?

  • Zero Code/JSON: Just pass a List of Texts and a List of Numbers.

  • Beautiful Defaults: Modern tooltips, smooth loading animations, and elegant color palettes out of the box.

  • Editor Previews: Stop guessing. See a mock preview of your chart directly inside the Bubble Editor!

:seedling: What’s Next (The V1 Promise) This is just V1! We wanted to get these beautiful visuals into your hands immediately. In the upcoming updates, we will be adding Click Interactions & Workflows (e.g., clicking a slice of a pie chart triggers a Bubble workflow) and even more features!

:link: Check out the Demo Page: CLICK HERE

:link: Get the Free Version: CLICK HERE

:link: Get the PRO Version: CLICK HERE

I would love to hear your feedback, bug reports, or requests for new charts! What visualization is your app missing right now? Let me know below! :backhand_index_pointing_down:

Happy building! :hammer_and_wrench:

Hey fellow Bubblers! :waving_hand:

I’m incredibly excited to announce the biggest update ever to VizBlocks Pro! We’ve completely rebuilt the core of our charting engines (ApexCharts, D3.js, and Vis.js) to bring you Enterprise-grade interactivity and layout controls.

If you are building SaaS dashboards, analytics tools, or onboarding flows, this update is going to change the way your users interact with your app.

Here is what’s new:

:bullseye: The “Drill-Down” Interactivity Engine Almost every single VizBlock is now fully clickable! When a user clicks a chart, it immediately triggers a Bubble Event and exposes Custom States (clicked_value, clicked_category, clicked_node_id, etc.).

  • Use Case: Click a “Lost Leads” slice in the Pyramid chart to open a popup with a Repeating Group of those specific users!

:abacus: Advanced Math & Statistics On-The-Fly

  • Scatter Plot: Now features an automated Linear Regression engine. Just toggle “Show Trendline”, and VizBlocks does the math to draw a perfect trendline through your data.

  • Histogram: Automatically calculates Sturges’ formula to generate Bins, and calculates Standard Deviation to overlay a perfect Gaussian Normal Distribution curve!

:magnifying_glass_tilted_left: D3.js Mind Maps: Zoom & Pan Building large organizational charts? The Mind Map now features a smooth Zoom & Pan engine. Drag the canvas, use your mouse wheel to zoom in/out, and double-click to re-center. It also features smart UI contrast (automatically adjusting text colors based on node depth).

:deciduous_tree: Flow Charts: Hierarchical Layouts Tired of messy “organic” network nodes? You can now force your Vis.js Flow Charts into beautiful, strict Top-Down or Left-Right trees with a single dropdown.

:gem_stone: Smart Number Formatting You no longer have to look at ugly numbers like 150000. You can now set independent Prefixes and Suffixes! (e.g., Prefix: $, Suffix: k). The Mixed Chart even supports Dual Axis Formatting — meaning Series 1 can show as currency ($50k) while Series 2 shows as a percentage (45%).

:shield: Bulletproof UI Fixes

  • Tooltips: Engineered a custom CSS injection so tooltips never get cut off by group boundaries or screen edges.

  • Timeline & Progress Lists: Added “Active Step” pulsing animations and sub-titles.

  • Datetime: Added a “safe shield” that prevents charts from crashing if invalid date texts are passed.

Check out the updated demo page and let me know what you think! As always, I’m here to help you build the best dashboards possible. Happy building! :hammer_and_wrench::sparkles:

Hey Bubble family! :waving_hand:

We’ve been in the lab listening to your feedback, and today we are thrilled to announce VizBlocks V3!

We know you loved how VizBlocks made your dashboards look, but we wanted to push the boundaries of what these charts could actually do. With V3, we transformed our visualizations from static displays into fully interactive workflow engines.

Here is a quick look at the major upgrades:

:computer_mouse: Click Everything! Every chart (Scatter, Flow Chart, Mind Map, Venn, you name it) now supports click events! We standardized exposed states across the board so you can easily extract the clicked_index, clicked_category, or clicked_value and trigger your Bubble workflows. Want to use a Timeline or a Treemap as a navigation menu? Now you can!

:artist_palette: Deep Design Control You asked for pixel-perfect control, and we delivered.

  • Change the padding between boxes in Treemaps and bubbles in Clouds.

  • Change connecting lines to dashed/dotted in Timelines.

  • Choose custom shapes (diamonds, databases, ellipses) for Flow Chart nodes.

  • Toggle line styles (smooth, straight, stepline) in Mixed Charts.

:speech_balloon: Smart Formatting & Labels No more raw, ugly numbers. You can now set Prefixes (e.g., $) and Suffixes (e.g., hrs) globally per chart. We also added toggles to show permanent Data Labels directly on bars, points, and Venn slices, alongside “Smart Zero” logic that cleanly hides empty data.

:bar_chart: Chart Highlights:

  • Venn Diagram: Now detects if a user clicked a parent circle or an intersection!

  • Mind Map: New “Start Collapsed” mode for handling massive data trees cleanly.

  • Pictograph: Now acts as a fully interactive input—perfect for custom 10-point rating systems.

  • (And massive upgrades to Bubble, Stacked Bar, Area, Word Cloud, Progress List, and Mixed Charts!)

We can’t wait to see the interactive dashboards you build with V3. Update the plugin in your editor today and let us know what you think below! :backhand_index_pointing_down:

Happy building! :hammer_and_wrench::sparkles:

Hey Bubblers! :waving_hand:

I’m super excited to announce a massive update to VizBlocks! Version 4 brings 5 incredibly powerful, interactive, and responsive charts designed to help you build enterprise-grade, B2B, and financial applications. :briefcase::money_with_wings:

Here is what’s new in V4:

  • :spiral_calendar: Gantt Charts: Build project management tools with grouped team rows and custom task colors.

  • :ocean: Waterfall Charts: Perfect for financial apps to display cumulative revenues, costs, and net profit totals.

  • :spider_web: Radar (Spider) Charts: Visually compare attributes and performance metrics.

  • :thermometer: Heatmaps: Display data density matrixes! The element handles the color shading automatically based on your base color.

  • :chart_increasing: Candlestick Charts: Building a crypto or stock trading app? Easily render OHLC (Open-High-Low-Close) data with beautiful, interactive candles.

:high_voltage: Fully Interactive Workflows: Just like the rest of the VizBlocks library, these new charts aren’t just pretty images. Every single chart comes with custom click events and exposed states. You can click on a Gantt task, a Heatmap cell, or a Trading Candle to trigger Bubble workflows and instantly retrieve the clicked data (Values, Dates, Categories, etc.) to show popups or edit forms!

:artist_palette: No Code, 100% Responsive: Everything adapts beautifully to your Bubble containers. Just drag, drop, and feed your lists of data.

Go update to V4 and let me know what you build with these new tools! I’d love to see your dashboards.

Happy building! :hammer_and_wrench::sparkles:

Hey Bubblers! :waving_hand:

We are thrilled to announce the launch of VizBlocks V5! We listened closely to your feedback about custom charting limitations in Bubble, went back to the drawing board, and completely overhauled our execution loop.

V5 is entirely focused on UX, performance, and eliminating the friction of standard web charts.

Here is what’s new on the deck:

:counterclockwise_arrows_button: 1. Live Data Streaming (Goodbye Flashing Screens! :stop_sign:**)**

  • The Reality before: Most Bubble plugins destroy and rebuild the SVG element whenever a repeating group or Search updates, causing a jarring white flash.

  • The V5 Solution: VizBlocks now uses native progressive diffing. When your data shifts, the graph stays alive—bars slide up/down, lines bend organically, and candles adjust dynamically. Smooth as silk!

:link: 2. Cross-Chart Syncing (The Analytics Dream :brain:**)** Need to link a Sales Line Chart with a Volume Bar Chart right below it? Just type the exact same text into the Sync Group ID field on both elements. VizBlocks connects them instantly! Hovering, zooming, or panning on one chart mirrors the exact interaction across the entire dashboard group.

:bullseye: 3. Brand New Element: Radial Bars & Gauges! We added a beautiful “2-in-1” circular indicator element:

  • Concentric Rings: Pass a list of metrics to get an Apple Watch-style activity tracker with gorgeous rounded line ends.

  • Speedometer Gauges: Toggle a checkbox to turn it into a 180° performance scorecard with customizable inner hollow sizes and central label macros.

:inbox_tray: 4. Instant Browser-Side Export Engine (PNG & PDF :page_facing_up:**)** No backend workflows, no external API costs, no timeouts. Trigger our Download Chart workflow action to instantly pull the layout base, mathematically scale it to fit a landscape A4 page, and push a crisp PNG or PDF straight to your user’s downloads folder.

:hammer_and_wrench: Built for Developers, Scaled for Production

  • Zero Script Bloat: We removed inline DOM traps and leveraged global shared header streaming for instant loading.

  • Full Workflow Integration: Deep support for custom clicks, exposing data points, categories, dates, and item indexes natively back to your Bubble states.

We’d love to hear your thoughts! Drop your feedback, show us your new dashboards, and let us know what element you want us to tackle next! :backhand_index_pointing_down: