Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Force-Directed Graph V3

Public visualization

Force-Directed Graph V3

0 stars0🌍 Public
Sschneich
Last edited Aug 27, 2022
Created on Aug 24, 2022
Forked from HTML Starter

This example shows a force-directed network graph of character interactions from the novel Les Misérables. The visualization displays nodes as unlabeled circles and links as straight lines, with the layout computed dynamically through a physics simulation. Using D3 v6 within a React framework, the code applies `d3.forceSimulation` with `forceManyBody`, `forceLink`, and `forceCenter` to position the 17 nodes and 14 links. The SVG elements update their coordinates on each simulation tick, though the data only includes a subset of the full character relationships.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.

Comments

Sign in to join the discussion.

MIT Licensed