Fork of Fork of graph

100%

Fork of Fork of graph

✓ Published0🌍 Public

Last edited Apr 8, 2025

Created on Apr 8, 2025

Forked from Tree 1

This graph visualization shows the relationships between streaming platforms and their original shows, with Netflix and Hulu as platform nodes connected to their respective series. The force-directed layout uses d3.forceSimulation with link, charge, and center forces to position nodes dynamically, while SVG lines and circles represent links and nodes, colored by group. The code binds node labels directly and updates positions on each simulation tick, creating an interactive-looking network diagram rendered entirely in SVG.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Netflix titles network graph

A force-directed network graph visualizes the hierarchical structure of Netflix titles, categorizing a central catalog into genres, sub-genres, and individual movies or TV shows. Nodes are colored by group and labeled with their names, while links connect each level. The visualization uses `d3.forceSimulation` with `forceLink`, `forceManyBody`, and `forceCenter` to position the SVG elements, with circle radii and stroke styling defined in CSS. The underlying data is hardcoded in JavaScript, representing a small, curated subset of the Netflix catalog.

Vviveknaroju999@gmail.com

83% match

Loading thumbnail…

Fork of fork 8.2

A force-directed graph maps PG-13 movies to their availability across Netflix, Amazon Prime, Disney Plus, and Hulu. The visualization uses `d3.v3` with an SVG rendering and a `forceSimulation` layout to position nodes, where the central hub connects to four streaming platforms, which in turn branch to individual film titles. Node and link styling is applied directly through CSS classes, with circles and text labels for each movie. The graph's static layout and explicit edge list present a clear, non-interactive overview of content distribution across these services.

Ppmbhupathibalu@gmail.com

83% match

Loading thumbnail…

Fork of Blank Slate with Hot Reloading

This example demonstrates a simple network graph showing the distribution of PG-13 movies across OTT platforms like Netflix, Amazon Prime, Disney Plus, and Hulu. It uses d3.forceSimulation with d3.forceLink, d3.forceManyBody, and d3.forceCenter to position nodes and links in a force-directed layout. The visualization renders nodes as blue circles with tooltips, and the code defines both the JSON data structure and the SVG rendering inline.

Mmaheshpolisetty22@gmail.com

81% match

Loading thumbnail…

Fork of HTML Starter

This network graph visualizes the chronological sequence of Netflix release years, with each node representing a unique year and links connecting adjacent years to form a temporal chain. The graph uses d3.forceSimulation with forceLink, forceManyBody, and forceCenter to position the nodes dynamically in an SVG container. Data is loaded from a GitHub-hosted CSV file using d3.csv, and circles are rendered as nodes with teal fill and gray connecting lines. Node positions update on each simulation tick, allowing the network to settle into a stable layout.

Pprasaad.lakshme901@gmail.com

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

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

80% match

Loading thumbnail…

Fork of Force Network

A network chart displays relationships between actors, directors, and films, with nodes colored by group and sized by their connection count. The visualization uses d3.forceSimulation with forceLink, forceManyBody, forceCollide, and forceCenter to position nodes, while SVG lines represent links. Drag-and-drop interaction is implemented via d3.drag, and hover styling highlights nodes with a CSS class.

NNikhilMakkena

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

79% match