Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Fork of D3 v5 Zoomable Sunburst

Public visualization

Viewing a saved revision (read-only)

08fe9f883a284ec49024d08136178109

Fork of D3 v5 Zoomable Sunburst

0 stars0🌍 Public
MMaeva B
Last edited Sep 28, 2022
Created on Sep 28, 2022

This zoomable sunburst visualization displays the hierarchical structure of the Flare dataset, with each ring segment representing a category or subcategory sized by value. Clicking any arc zooms into that node, smoothly animating the layout so the selected subtree expands to fill the view. The chart is built with D3 v5 using the `d3.partition` layout and custom `d3.arc` paths, rendered as SVG with transitions driven by `transition.attrTween` and `d3.interpolate`. Labels rotate and fade based on visibility thresholds, while a central circle resets the view to the root.

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