Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

D3 v5 Zoomable Sunburst

Public visualization

D3 v5 Zoomable Sunburst

0 stars1🌍 Public
SShivrangi
Last edited Nov 7, 2019
Created on Nov 7, 2019

This D3 v5 zoomable sunburst visualizes a hierarchical dataset, using colored arcs to represent nested categories from the flare data loaded via the Observable standard library. Clicking an arc animates a zoom into that node, with transitions driven by `d3.arc` interpolation and `transition.attrTween` to smoothly reshape arcs and labels. The SVG rendering uses `d3.partition`, `d3.hierarchy`, and ordinal color scales, with visibility logic filtering arcs and text based on computed angular and radial bounds.

AI-generated description

Mike 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

Comments

Sign in to join the discussion.

MIT Licensed