Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Force Directed Graph with single links

Public visualization

Viewing a saved revision (read-only)

9a30d4b0607c4b858de84eee977680aa

Force Directed Graph with single links

1 star3🌍 Public
Ddreamofgerontius
Last edited Mar 10, 2021
Created on Mar 10, 2021
Forked from HTML Starter

This example shows a force-directed graph using D3.js v6, where nodes represent people and animals, linked by labeled relationships such as "owns" or "knows." The visualization uses the `d3.forceSimulation` API with a charge force, link force, and center force to position the nodes. Node images are rendered from a separate `images.json` file, and edges are drawn as paths with arrowheads and text labels along the curves. Users can drag nodes to fix their positions, and clicking a node toggles its selected state while restarting the simulation.

AI-generated description

A basic force directed graph to show one link between any two nodes.