Skip to main content
SimilarExport ZIP
100%

A2-2-ASSIGN-8

✓ Published0🌍 Public
Kkpavithrasai@gmail.com
Last edited Apr 13, 2026
Created on Apr 13, 2026
Forked from D3 Starter

This visualization shows a network of social media influencers, with nine nodes representing creators from YouTube, TikTok, and Instagram, connected by collaboration links. Nodes are pinned in rows by platform and use distinct shapes—circles, squares, and diamonds—to encode platform membership, while colors reinforce the grouping. Built with D3 v7, the example uses `d3.forceSimulation`, `forceLink`, and `forceManyBody` to position elements, though fixed coordinates (`fx`, `fy`) keep nodes in place. SVG rendering draws all links and node shapes, with a legend in the upper-left corner explaining the shape-color mapping.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Social Media Network - Assignment 8

This interactive network graph maps connections among six social media platforms—Facebook, Instagram, WhatsApp, YouTube, Twitter, and LinkedIn—with color-coded nodes and labeled links. Users can drag nodes to rearrange the layout while a force-directed simulation continuously repositions elements. Built with D3 v7, the visualization uses `d3.forceSimulation`, `d3.forceLink`, `d3.forceManyBody`, and `d3.forceCenter` to compute the graph’s geometry, rendering nodes as SVG circles and links as lines. The data is defined inline as JavaScript arrays within the module.

AAKSHAY
83% match
Loading thumbnail…

A2Q7P2

This visualization shows a network of people connected by friendship links, with each person represented as a pink circle labeled with their name and connected by green arrowed lines. The graph uses d3.forceSimulation with forceLink, forceManyBody, forceCollide, and forceCenter to position the nodes. Users can drag nodes interactively, and hovering highlights a node with a blue border. Data comes from a local JSON file containing ten nodes and twelve links, rendered as SVG elements.

MmNamratha25
80% match
Loading thumbnail…

socialnetwork

This social network visualization displays seven social media platforms as labeled nodes, with weighted green links connecting them. The graph shows relationships between applications like Facebook, Instagram, and Twitter through varying line thicknesses. Using D3.js v4, the visualization implements a force-directed layout via the deprecated `d3.layout.force()` API, which simulates attraction and repulsion between nodes. Node positions are updated dynamically on each tick, while JSON data from `data.json` defines the network structure. The SVG rendering includes draggable circles, orange text labels, and a sky-blue background.

Vvaddepallinaveen
80% match
Loading thumbnail…

A8 - Node-Link with Force Directed Layout

This visualization shows the Advogato social network’s 1,000-member connection structure as a node-link diagram, with gray lines representing edges and green circles for nodes. Using D3 v7’s `d3.forceSimulation`, it applies `forceManyBody` for repulsion, `forceLink` for edge spacing, and `forceCenter` for layout, updating positions via the simulation’s tick event. The SVG renders at 3500×2500 pixels, requiring zoom or scroll to view fully, and loads data from a CSV in the Network Data Repository.

AAndrew Blakeslee Moore
79% match
Loading thumbnail…

Social Network

This example displays a small social network as a force-directed graph, with nodes representing named individuals and lines (links) sized by a numeric weight. It uses the older `d3.layout.force` API from D3 v4 (and also loads D3 v2) to simulate physical motion, making nodes draggable and repositioning linked elements on each tick. Data comes from a local JSON file, and the rendering is done with SVG circles, text labels, and lime-colored line elements, all styled via inline CSS.

VVaishnavi6199
79% match
Loading thumbnail…

Social Network

This example displays a small social network as a force-directed graph, with nodes representing named individuals and lines (links) sized by a numeric weight. It uses the older `d3.layout.force` API from D3 v4 (and also loads D3 v2) to simulate physical motion, making nodes draggable and repositioning linked elements on each tick. Data comes from a local JSON file, and the rendering is done with SVG circles, text labels, and lime-colored line elements, all styled via inline CSS.

VVaishnavi6199
79% match
Loading thumbnail…

D3 Node-Link Diagram

This example shows a node-link diagram of social network data, using a force-directed layout to position 16 nodes and their connecting links. The visualization uses D3 v7's `d3.forceSimulation` with `forceManyBody`, `forceLink`, and `forceCenter` to calculate the layout, while rendering nodes as SVG circles and edges as lines with animated tick updates. Node colors come from `d3.scaleOrdinal` with the `schemeSet1` palette, and hovering a node triggers a tooltip via mouseover events. Data is loaded from a CSV file containing source, target, and link values.

Mmariahdiaz
79% match
Loading thumbnail…

Social Network Graph

This social network graph visualizes 19 nodes connected by 14 links, with each node colored by its assigned group using D3's `d3.scaleOrdinal` and `d3.schemeCategory10`. The nodes and links are rendered as SVG circles and lines, with node labels displayed via text elements. The layout is computed dynamically using `d3.forceSimulation`, combining `d3.forceLink`, `d3.forceManyBody`, and `d3.forceCenter` to position the network. As the simulation runs, each tick updates the coordinates of the circles, lines, and labels within the SVG container.

Ssaikrishnabussa
79% match