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)

75e6843422554ae18d01ec8fb90d06c2

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