Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Fork of React & D3 Starter

Public visualization

Viewing a saved revision (read-only)

d30f9f2a21d5461589e9a22f50cd692a

Fork of React & D3 Starter

0 stars0🌍 Public
Rrajivkarri98@gmail.com
Last edited Nov 10, 2025
Created on Nov 10, 2025
Forked from React & D3 Starter

This example visualizes a city connection network, showing six cities as nodes and the routes between them as links. The graph is rendered as an SVG and is interactive, allowing users to drag nodes, which triggers a force-directed layout simulation. The code uses D3 v7 APIs such as `d3.forceSimulation`, `d3.forceLink`, `d3.forceManyBody`, and `d3.forceCenter` to position the nodes, with labels displaying each city's name. The visualization is built within a React framework, as demonstrated by the `index.jsx` file using `useRef` and `useEffect` to integrate D3.

AI-generated description