Fork of D3 v5 Zoomable Sunburst

Fork of D3 v5 Zoomable Sunburst

This zoomable sunburst visualizes the hierarchical Flare dataset, showing the relative sizes of categories and subcategories in a radial layout. Users click on arcs to zoom into deeper levels, with smooth animated transitions between views. Built with D3 v5, it uses `d3.hierarchy`, `d3.partition`, and `d3.arc` to compute the layout, while `d3.interpolate` and `transition.attrTween` animate arc paths and label positions. The color scale maps top-level categories using `d3.scaleOrdinal` and `d3.interpolateRainbow`.

RRockkmr

Fork of D3 v5 Zoomable Sunburst

This interactive sunburst diagram visualizes the hierarchical Flare dataset, showing the relative sizes of its branches and leaves through concentric, angle-based arcs. Clicking an arc zooms in to display that node as the new root, with a smooth 750-millisecond transition animating the arcs and labels via `d3.arc` and `transition.attrTween`. The chart uses D3 v5's `d3.hierarchy`, `d3.partition`, `d3.scaleOrdinal`, and a quantized rainbow color scale, rendering as SVG. Labels rotate and flip to maintain readability, and center-clicking returns to the previous level.

Bblueyjuice

Fork of D3 v5 Zoomable Sunburst

This interactive sunburst diagram visualizes the hierarchical Flare dataset, showing the relative sizes of categories and subcategories through radial arcs. Users can click on any arc to zoom into that portion of the hierarchy, with smooth animated transitions repositioning the layout. The visualization is built with D3 v5, using `d3.partition` to compute the layout, `d3.arc` for arc paths, and `transition.attrTween` to animate changes between states. Colors are assigned via `d3.scaleOrdinal` with an interpolated rainbow palette, and labels rotate to remain readable at various depths.

DDonald Bagwell

Fork of D3 v5 Zoomable Sunburst

This interactive sunburst diagram visualizes the hierarchical Flare dataset, displaying the relative sizes of categories and subcategories as concentric arcs. Users can click on any arc to zoom into that branch, with smooth animated transitions between views. The visualization uses D3 v5’s `d3.partition` layout and `d3.arc` generator to compute arc geometry, while `transition.attrTween` and `d3.interpolate` animate changes. A categorical color scale assigns hues to top-level nodes, and labels rotate and fade based on arc visibility thresholds. The data is loaded from an Observable-hosted JSON module.

RRene

Fork of Fork of D3 v5 Zoomable Sunburst

A zoomable sunburst visualization displays the hierarchical Flare dataset, showing the relative sizes of categories and subcategories through concentric ring segments. Clicking a node smoothly animates and re-scales the chart to focus on that branch, with the central circle resetting the view. Built with D3 v5, it uses `d3.partition`, `d3.hierarchy`, and `d3.arc` for layout and rendering, while `transition.attrTween` and `d3.interpolate` drive the animated transitions between zoom states. Color mapping uses `d3.scaleOrdinal` with `d3.interpolateRainbow`.

DDeclan Naughton

Fork of D3 v5 Zoomable Sunburst

A zoomable sunburst visualization displays the hierarchical Flare dataset as concentric arcs, with clickable parent nodes that smoothly re-scale the layout for detailed exploration. Built with D3 v5, the code uses `d3.hierarchy`, `d3.partition`, and `d3.arc` to render SVG paths, while `transition.attrTween` animates arc geometry and label rotations over 750ms. Colors are assigned via `d3.scaleOrdinal` with an interpolated rainbow palette, and node tooltips show ancestor paths and formatted values.

CChristianABeier

Fork of D3 v5 Zoomable Sunburst

This sunburst chart visualizes the hierarchical structure of the Flare dataset, with arcs representing nodes sized by value and color-coded by top-level branch. Clicking an arc zooms and centers the view on that node, while a click on the center circle returns to the root. Built with D3 v5, it uses `d3.partition`, `d3.hierarchy`, and `d3.arc` for layout, with animated transitions driven by `transition.attrTween` and `d3.interpolate` to smoothly update arc paths and labels during zoom.

FFDASSO

Fork of D3 v5 Zoomable Sunburst

This interactive sunburst visualization displays the hierarchical structure of the Flare dataset, where each arc segment represents a node and its angular width encodes the node's value. Clicking a segment zooms in to show that node as the new root, with smooth animated transitions updating arcs and labels. Built with D3 v5, the visualization uses `d3.hierarchy`, `d3.partition`, and `d3.arc` for layout, while `transition.attrTween` animates the changing arc paths during zoom. Color is assigned per top-level category using a rainbow scale.

Jjmmoser7