Standalone HTML Canvas physics-based node graph portfolio

Building an interactive node graph visualization as a single HTML file with no external JS libraries requires implementing physics simulation, hit detection, drag handling, touch support, and particle effects all from scratch using Canvas API.

Use a force-directed graph layout with repulsion between all node pairs (O(n^2) but fine for < 50 nodes), spring forces along edges, and center pull gravity. Render with requestAnimationFrame loop that runs simulation + draw each frame. For interaction: track mouse/touch positions, implement hit detection by reverse-iterating nodes and checking radius distance, support drag by pinning node position during mousedown/touchstart. Dim unconnected nodes on hover using an adjacency map built at init time. Particle effects along edges use simple linear interpolation with fade-in/out at endpoints. All state (nodes, edges, adjacency) stored in plain arrays/maps - no framework needed.