Actor Graph

100%

✓ Published0🌍 Public

Last edited Apr 6, 2023

Created on Apr 6, 2023

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.

AI-generated description

D3 Forces.

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?

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?

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

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

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

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

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

81% match

Loading thumbnail…

Actor Graph

This interactive network visualizes the connections between software applications and IT systems, from a dataset of application names and the interfaces linking them. The force-directed graph uses circle nodes for each application and grey lines for their relationships. The visualization is constructed with d3.forceSimulation, d3.forceManyBody, d3.forceLink, d3.forceCenter, d3.forceCollide, and implements a drag interaction.

KKyle?

80% match