Skip to main content
SimilarExport ZIP
100%

Fork of MBB Q8.2

✓ Published1🌍 Public
Ppmbhupathibalu@gmail.com
Last edited Apr 3, 2024
Created on Apr 3, 2024

This fork of MBB Q8.2 displays a network graph of Netflix movies grouped by genre, with a central "Movies" node connecting to three genre hubs and up to three movie titles per genre. The visualization uses d3.forceSimulation with forceLink and forceManyBody to position nodes, rendered as SVG circles colored by a d3.scaleOrdinal based on node type. Data is loaded from a CSV file via d3.csv and filtered for movies, with the genre extracted from the `listed_in` field.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Fork of MBB Q8.2

A force-directed network graph visualizes the relationships between a central "Movies" category, three primary genres (Comedy, Documentary, Drama), and up to three representative movie titles per genre, based on a Netflix dataset loaded via `d3.csv`. The graph uses `d3.forceSimulation` with force-link, many-body, and center forces to position nodes, which are rendered as colored SVG circles based on a categorical color scale. Each node and link is labeled, and the simulation updates node positions and link endpoints on each tick.

Mmanthenasirisha06@gmail.com
93% match
Loading thumbnail…

Fork of MBB Q8.2

This graph visualizes the network of Disney+ movies grouped by genre. It uses a D3.js force-directed layout with `d3.forceSimulation`, `d3.forceLink`, and `d3.forceManyBody` to position square nodes and directed links with arrow markers. Nodes are colored by type (category, genre, title) using `d3.scaleOrdinal`, with labels rendered as SVG text. Data comes from a CSV file loaded via `d3.csv`, showing up to five movie titles per genre.

Ppmbhupathibalu@gmail.com
92% match
Loading thumbnail…

Fork of MBB_8.2

A force-directed graph maps the distribution of PG-13 movies across four streaming platforms: Disney Plus, Netflix, Amazon Prime, and Hulu. The central node links to each platform hub, which in turn connects to individual film titles. Using `d3.forceSimulation` with `forceLink`, `forceManyBody`, and `forceCollide`, the SVG layout positions draggable nodes with circular markers. The data comes from a local `data.json` file, rendered with D3 v6 within a React framework.

Ppmbhupathibalu@gmail.com
85% 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
81% match
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
81% match
Loading thumbnail…

Fork of Fork of Fork of Fork of Jeevani Network

This network graph shows a hierarchical structure of Amazon Prime movies, organized into three top-level genres (Comedy, Documentary, Drama), each connected to up to three movie titles. The visualization uses a force-directed layout created with `d3.forceSimulation`, combining force-link, `forceManyBody`, and force-center to position rectangular nodes representing categories, genres, and titles, with distinct colors and a custom marker for directed connections. The data is loaded from a CSV of Amazon Prime titles using `d3.csv`, filtered to movies, and grouped by the first listed genre before building the node and link arrays.

BBelede Rahul
77% match
Loading thumbnail…

Fork of Fork of HTML Starter

This visualization uses a force-directed graph to show the distribution of PG-13 movies across four major streaming platforms: Netflix, Amazon Prime, Disney Plus, and Hulu. Each movie is represented as a circular node, color-coded cyan, with the platform as a central hub. The interactive chart uses `d3.forceSimulation` to apply link, charge, collision, and centering forces, while user drag events allow manual repositioning of nodes. SVG rendering draws connecting lines with arrow markers to indicate relationships, and hover effects highlight individual nodes.

Ppmbhupathibalu@gmail.com
76% 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
75% match