🌍 Public
D3 v5 Zoomable Sunburst
This zoomable sunburst from Mike Bostock’s example, ported to D3 v5 by tdog8901, visualizes hierarchical data using an interactive radial layout with SVG and animated transitions. Clicking a node zooms into that subtree, smoothly re-scaling arcs via `transition.attrTween` and interpolated path data. The code uses `d3.hierarchy`, `d3.partition`, and `d3.arc` to render the rings, with a color scale based on top-level names. It loads data from a custom `flare.json` file and includes labels that fade in or out based on visibility thresholds.
AI-generated descriptionMike Bostock's D3 Zoomable Sunburst example
- with D3 v5 (based on the changes in v5) <br></br> Ported from this Observable notebook for this forum thread. Many thanks to Bryan Gingechen who answered my question about the necessary steps to get from an (Observable) JavaScript notebook to a vanilla JavaScript index.html. He presented his solution on blockbuilder.org
MIT Licensed
Comments
Sign in to join the discussion.