Skip to main content
100%

Circle-Packing II

✓ Published0🌍 Public
CCBasis
Last edited Mar 17, 2019
Created on Mar 17, 2019

This example visualizes a flat dataset of names and values using a circle-packing layout, where each person’s name appears as a separate circle. The visualization shows the hierarchical structure of the data through nested circles, with each circle’s size proportional to its value, though all values are equal here. The code uses the d3.pack layout to compute circle positions and radii, then appends SVG circles and text labels with clip paths to keep text within the circles. Data is loaded from a CSV file via d3.csv, and the hierarchy is built with d3.hierarchy and .sum().

AI-generated description

forked from <a href='http://bl.ocks.org/mbostock/'>mbostock</a>'s block: <a href='http://bl.ocks.org/mbostock/07ec62d9957a29a30e71cad962ff2efd'>Circle-Packing II</a>

gpl-3.0 Licensed

Similar vizzes