Fork of React & D3 Starter

100%

Fork of React & D3 Starter

✓ Published0🌍 Public

Nnithinreddypinikesi@my.unt.edu

Last edited Apr 13, 2026

Created on Apr 13, 2026

This interactive network uses a force-directed layout to visualize the connections between Tollywood actors and their movies. Actors appear as orange circles and movies as sky-blue rounded rectangles. The graph is built with D3 v7, using `d3.forceSimulation` with `forceLink`, `forceManyBody`, and `forceCenter` to compute node positions, while `drag()` lets users move actors and movies. Edges are drawn as straight lines between connected nodes, and labels are placed below each node. The implementation uses SVG for rendering and an inline dataset.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Fork of Fork of Force Network

This interactive force-directed network visualizes connections between actors, directors, and films. Using D3 v6, it employs `d3.forceSimulation` with `forceLink`, `forceManyBody`, `forceCollide`, and `forceCenter` to position nodes. Data from `data.json` is rendered as SVG circles and connecting lines, with markers indicating relationships. Nodes are draggable, and relationship text labels are shown but incomplete.

Ssaiteja0725

85% match

Loading thumbnail…

Fork of Force Network

This force-directed network visualization uses d3.forceSimulation to map relationships between actors, directors, and films from a JSON data source. Nodes are rendered as colored circles in SVG, with link lines showing connections and arrowheads indicating direction. The code implements drag interactions and adjusts node positions through the simulation's tick handler, while link labels display truncated relationship types.

Bbindhureddy98

84% match

Loading thumbnail…

Fork of Force Network

A force-directed network diagram maps actors and directors to their films, with nodes colored by group and sized by connection value. Draggable circles represent people and movies, while gray lines show relationships such as "Acted in" or "Directed." The visualization uses D3 v6's `d3.forceSimulation` with link, charge, collision, and center forces, rendering nodes as SVG circles and links as lines with markers. Data comes from a local JSON file, loaded via `d3.json`.

Bbindhureddy98

83% match

Loading thumbnail…

Fork of Force Network

A force-directed network visualizes the relationships between actors, directors, and films. Actors and directors are color-coded by their professional role, with films as separate nodes. The graph uses a physics simulation with link, charge, and collision forces to position the nodes. Using `d3.forceSimulation` and `d3.forceLink`, the layout is interactive, and users can drag nodes to explore connections. The code loads data from JSON and renders the network as SVG.

DDeepa-Murugesan

83% match

Loading thumbnail…

Fork of Fork of Force Network

A force-directed network chart maps actors, directors, and films into colored nodes, with links representing acting or directing relationships. The layout uses `d3.forceSimulation` with forces for links, charge, collision, and centering. Circles are colored by a `scaleOrdinal` group mapping, and SVG markers define arrowheads for links. Data loads from `data.json`, and nodes support drag interaction via `d3.drag`. Labels and relationship text are appended but incomplete, while the tick handler updates line and circle positions.

Bbindhureddy98

83% match

Loading thumbnail…

Fork of Force Network

This force-directed network graph visualizes relationships between actors, directors, and films using data from a JSON file. Nodes are color-coded by group type (actors, directors, films), with links representing connections like "Acted in" or "Directed." The visualization uses `d3.forceSimulation` with forces for links, charge, collision, and centering, rendered as SVG with draggable nodes and hover highlighting. Arrow markers denote link direction, while the simulation updates node and link positions on each tick.

Ddas888530

82% match

Loading thumbnail…

Fork of Actor Graph Attempt 2

A dark-themed network graph visualizes actor connections from a movie dataset, with each actor as a node and edges linking co-stars. The force-directed layout uses `d3.forceSimulation`, `forceManyBody`, `forceLink`, and `forceCenter` to position nodes and lines dynamically. Actors are parsed from the CSV's `Actors` column, and nodes and links are rendered as SVG circles, text labels, and lines. The visualization updates positions on each simulation tick, showing the relational structure of the cast.

CCurran Kelleher

81% match

Loading thumbnail…

Fork of Fork of Force Network

A force-directed network diagram maps connections between films, actors, and directors. Actors and directors appear as red or green nodes, while films are blue, gold, or orange, with link thickness reflecting relationship strength. The visualization uses d3.forceSimulation with forceLink, forceManyBody, forceCollide, and forceCenter to position elements dynamically. Data is loaded from a JSON file and rendered as SVG circles and lines. Arrowheads, labels, and drag-and-drop interaction are not yet implemented.

Iii-kc

81% match