Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

D3 v4 Circle-Packing

Public visualization

Viewing a saved revision (read-only)

034d458f6deb4783929c15cd827d1179

D3 v4 Circle-Packing

1 star1🌍 Public
Ttasqon
Last edited Feb 5, 2019
Created on Feb 4, 2019

This example shows a hierarchical circle-packing layout of the Flare software package’s class hierarchy, with each node’s size proportional to its value and color mapped to depth. Using D3 v4’s `d3.stratify` to build the hierarchy from CSV data and `d3.pack` for layout, circles are rendered as SVG groups. Interactivity highlights all ancestor circles on hover via the `d3.selectAll` and `classed` methods, while leaf labels are clipped to their circles.

AI-generated description

Mike Bostock's Circle-Packing example

  • with D3 v4