Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

VarshaGNetwork

Public visualization

Viewing a saved revision (read-only)

cc0237cc700c4088b6ce15dfbcafa588

VarshaGNetwork

0 stars0🌍 Public
VVReddy913
Last edited Jul 9, 2022
Created on Jul 9, 2022

This example shows a force-directed network of seven named nodes connected by weighted links, with purple circles labeled by green text. The visualization uses D3 v4's `d3.layout.force` to simulate node positions, applying gravity, charge, and link distance, while rendering SVG lines and groups. Data loads from a local JSON file with node names and link weights. Users can click and drag nodes, and the tick handler updates line coordinates and node transforms dynamically. Link thickness encodes weight via `Math.sqrt(d.weight)`, and the SVG canvas is sized 1000 by 500 pixels.

AI-generated description

See also React Starter.