🌍 Public
Viewing a saved revision (read-only)
7e9b553978f94ad38f3641d7f8feb0fd
D3 Pack Layouts
This example demonstrates a D3 pack layout, which visualizes hierarchical data as nested circles. The dataset defines a tree with a root node, two levels of children, and leaf nodes that carry numeric values. Using `d3.hierarchy` and `d3.pack`, the code computes circle positions and radii so that parent circles encompass their children proportionally to summed values. The visualization renders each node as a semi-transparent circle with a white stroke, and labels only the leaf nodes. The SVG is dynamically sized to fit the container, and nodes are positioned via CSS transform translations.
AI-generated description