🌍 Public
Viewing a saved revision (read-only)
c3aceed4f3b14048ad3743633c7aea78
Circle Pack with Gradients
This circle pack visualization displays the file hierarchy of the React source code, with each circle’s size proportional to file size and color encoding file extension. It uses `d3.pack`, `d3.hierarchy`, and `d3.zoom`, with radial gradients applied to every circle via SVG `<radialGradient>` elements. Gradients are computed from a depth-based grayscale scale for directories and per-extension colors for files. The data loads from a remote Gist, and dynamic recomputation is memoized on DOM nodes using a custom `computed` function.
AI-generated descriptionA circle pack visualization of the React source code.
Data comes from Gist:File Loading Script.