🌍 Public
Viewing a saved revision (read-only)
752fe8a60a7d4fc9a3a95ef06c0eda57
Fork of D3 v5 Zoomable Sunburst
This interactive sunburst chart displays the hierarchical structure of the Flare software system, using segment size to encode file sizes and color to distinguish top-level categories. Built with D3 v5, it renders as SVG and responds to user clicks on segments to zoom in and out of the hierarchy. The visualization uses D3’s `d3.arc`, `d3.partition`, and `d3.hierarchy` APIs to compute the layout, with animated transitions handled through `d3.transition` and `transition.attrTween` for smooth rescaling of arcs and labels. The data originates from the Flare dataset’s JSON representation, sourced from Observable.
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