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

Showcase Plugins
1

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:

2 Likes
2

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:

1 Like