Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Tree with Force Layout Prototype

Public visualization

Viewing a saved revision (read-only)

58e5cb2205fa4b2ab87001a83015ad4c

Tree with Force Layout Prototype

1 star0🌍 Public
CCurran Kelleher
Last edited Mar 8, 2024
Created on Mar 6, 2024
Forked from Circles with D3

This visualization showcases a hybrid approach to rendering 13,748 nodes of hierarchical data. It begins with a tidy tree layout to establish structure, then refines it using a force-directed simulation with link, charge, and position forces. The canvas is drawn with device-pixel-ratio scaling, and nodes are colored based on their depth using an HSL color scale, creating a radial, color-coded tree. Hot reloading lets parameters like gravity and link strength be adjusted live while the simulation runs, allowing real-time tuning. The animation continuously restarts to avoid premature convergence, and the canvas rendering supports smooth, interactive exploration of the large dataset.

AI-generated description