Graph

100%

✓ Published0🌍 Public

Last edited Mar 3, 2021

Created on Mar 3, 2021

This graph visualization maps the relationships between actors, directors, and films using a force-directed layout. It displays movies as one node type and the people involved as another, with arrows indicating the specific role each person played in a production, such as acting or directing. The visualization uses the D3.js library with the `d3.forceSimulation` and `d3.forceLink` APIs to simulate physical forces that position the nodes, while a custom drag interaction lets users rearrange the network. Data comes from the provided `data.json` file, which contains nodes for people and films along with links specifying their relationships.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Actor Graph

This interactive visualization displays a force-directed graph of actors and the movies they appear in, where each actor is represented as a node and connections between actors who share a film are shown as links. The graph is built using D3.js v7, with the `d3.forceSimulation` API handling node positioning and link physics. Data comes from a CSV file listing movies and their cast, parsed using `d3.csvParse`, and rendered as SVG elements (circles, text labels, and lines). The visualization explores collaborative networks among actors across the included film dataset.

KKyle?

89% match

Loading thumbnail…

Graph_test

This graph visualization shows the relationships between actors, directors, and films, with nodes representing people and movies connected by directed links that indicate actions like "Acted in" and "Directed." The node size and link thickness vary based on a value attribute, while different colors differentiate node groups. Built with D3.js v6, it uses `d3.forceSimulation` with link, charge, collision, and center forces to position the elements, and renders the graph as an SVG with arrowheads marking link direction. The visualization also supports zooming and panning via `d3.zoom`.

BButterflypatch

88% match

Loading thumbnail…

Force Network

This force-directed network visualizes the relationships between actors, directors, and films, with nodes colored by their type (actor, director, or film) and links weighted by the number of collaborations. The layout uses `d3.forceSimulation` with `forceLink`, `forceManyBody`, `forceCollide`, and `forceCenter` forces to position nodes, while user interaction is handled via `d3.drag` to manually reposition them. Node labels are displayed, and hovering highlights the node with a blue stroke. The data is loaded from `data.json` and rendered as an SVG, with markers on links to indicate direction.

Rrushithareddyy

86% match

Loading thumbnail…

Actor Graph

The Actor Graph is a force-directed network visualization built with D3.js, showing a small set of connected actors as labeled nodes and edges. It uses the `d3.forceSimulation` API with `forceManyBody` and `forceLink` forces to position the nodes, while `forceCenter` keeps the layout centered in the viewport. The graph is rendered as SVG elements, including circles, lines, and text labels, and is intended to be populated with data from the included `data.csv` file, which lists movies and their casts.

KKyle?

85% match

Loading thumbnail…

Force Network

A force-directed network diagram maps relationships between actors, directors, and films, using node colors to distinguish roles and link markers to show direction. The visualization runs a `d3.forceSimulation` with link, charge, collision, and centering forces, while SVG circles and text labels represent nodes, and lines with arrowheads depict connections. Node positions update on each simulation tick, and dragging via `d3.drag` lets users reposition elements, with hover effects highlighting selected nodes. The chart renders from the provided `data.json` file and uses `d3.scaleOrdinal` for the color scale.

AAnthony Alsford

84% 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

84% match

Loading thumbnail…

Force Network

A force-directed network chart maps the connections between actors, directors, and films from a local JSON dataset. Nodes are colored by group and sized uniformly, while links represent professional relationships such as "Acted in" or "Directed." Built with D3 v6, the visualization uses `d3.forceSimulation` with link, charge, collision, and center forces, and renders nodes and edges as SVG elements. Node positions update on each simulation tick, and nodes are interactive via `d3.drag`.

Ssgzzhinde

84% match

Loading thumbnail…

Force Network

A force-directed network diagram maps relationships between actors, directors, and films. Using d3.forceSimulation with link, charge, collision, and center forces, nodes drift and settle while connecting links and node labels render via SVG. Node color encodes group membership, and link labels show shortened relationship types. The chart loads data from a JSON file and supports dragging nodes to reposition them interactively.

NNita

83% match