Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Fork of D3 v5 Circle-Packing

Public visualization

Fork of D3 v5 Circle-Packing

0 stars0🌍 Public
LLouis Astorg
Last edited Jul 27, 2022
Created on Jul 27, 2022

This D3 v5 circle-packing visualization displays the hierarchical structure of the Flare software system, using circle size to represent the number of metrics for each module. The graph is built from a CSV file using `d3.stratify()` and `d3.pack()`, with node depth encoded through the `d3.scaleSequential(d3.interpolateMagma)` color scale. Circles are rendered as SVG elements, with clip paths and tspan text for leaf labels, while hovering highlights the ancestor chain via the `node--hover` class.

AI-generated description

Mike Bostock's Circle-Packing example

Comments

Sign in to join the discussion.

MIT Licensed