Skip to main content
SimilarExport ZIP
100%

Actor Graph

✓ Published0🌍 Public
KKyle?
Last edited Apr 6, 2023
Created on Apr 6, 2023

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.

AI-generated description

A scatter plot of the Iris Dataset with no axes.

MIT Licensed

Similar vizzes

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?
93% match
Loading thumbnail…

Actor Graph Attempt 2

A force-directed actor graph visualizes connections between performers who co-star in films from a movie dataset. White nodes and red labels represent actors, while white lines link co-stars. The visualization uses D3 v7’s `d3.forceSimulation` with `forceManyBody`, `forceLink`, and `forceCenter` to position the graph dynamically. An SVG canvas of 10000x10000 pixels renders the network, with node and link positions updated on each simulation tick.

KKyle?
90% match
Loading thumbnail…

Graph

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.

VVictor Lorena
89% 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
85% 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
85% 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
83% 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
82% 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