D3.js (data visualization)
D3.js is the canonical library for interactive data visualizations on the web. ArcadeLab auto-loads D3, so visualizations publish as one HTML file — no Observable account, no notebook runtime, no build pipeline. Embed your data inline; share the URL.
Version loaded: 7.8.5 (cdnjs)
ARCADELAB header for D3.js
Put this at the very top of your HTML file (before <!DOCTYPE html>). ArcadeLab will auto-inject the D3.js CDN — do not include your own script tag.
<!--ARCADELAB title: My Visualization description: A short description libraries: d3 emoji: 📊 color: teal -->
Good fits for D3.js on ArcadeLab
- Charts, dashboards, and one-off data viz
- Interactive data exploration tools
- Animated explainers driven by data
- Custom layouts that don't fit into a charting library
Full guide
📊How do I share a D3.js visualization without a build step?
Prompt template
🔬How do I prompt Claude or ChatGPT to make an interactive visualization?
Frequently asked
What version of D3 does ArcadeLab load?
D3 v7.8.5 (cdnjs). The modular v7 series — all submodules are bundled into the global d3 namespace.
Can my D3 viz fetch CSV or JSON from an API?
No — network requests are blocked. Embed your data inline as a JavaScript array or JSON constant. For small to medium datasets this is fine; for live data, ArcadeLab isn't the right host.
How does ArcadeLab compare to Observable for D3?
Observable is brilliant for D3 development and has a great notebook UX. ArcadeLab's lane is publishing a finished visualization as a permanent, embeddable URL with no Observable runtime dependency. Different use cases; use whichever fits.
Ready to publish a D3.js thing? Paste your HTML file and get a URL.
🚀Publish on ArcadeLab