Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Network graph of Social Connections

Public visualization

Viewing a saved revision (read-only)

9f0cf5b5f9b64d179840a078f5d1e024

Network graph of Social Connections

0 stars5🌍 Public
Ggopiganta
Last edited Apr 4, 2022
Created on Apr 3, 2022

This example visualizes a small social network of seven people, showing connections as green lines whose thickness reflects link weight, with labeled purple nodes positioned by a force-directed layout. The graph uses a fixed JSON dataset with node names and group assignments, rendered as SVG. It leverages the D3 v4 `d3.layout.force` API to simulate physics, enabling nodes to be dragged and repositioned interactively. Link widths are set via `Math.sqrt(d.weight)`, and both circles and text labels are styled through CSS.

AI-generated description

See also React Starter.