Sriram ICE-8 Social network

100%

Sriram ICE-8 Social network

✓ Published1🌍 Public

Last edited Mar 27, 2023

Created on Mar 27, 2023

A social network graph displays ten people connected by friendship links, with one relationship (Indu–Rahul) emphasized via a thicker line. It uses D3 v6's `d3.forceSimulation` with link distance, many-body charge, collision, and center forces to position nodes. Nodes are yellow circles with black outlines rendered as SVG, and arrows indicate link direction. The graph is interactive: nodes can be dragged, and hovering highlights them with a thicker stroke. Data comes from a local JSON file with node IDs, groups, and link metadata.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Social Network Graph --> ICE-8

This example depicts a small social network of ten people and their friendships as a force-directed graph. It shows individuals as circles and connections as directed lines with arrowheads, with the relationship type described as "Friend with" for all links. The visualization is built using D3.js v6, employing `d3.forceSimulation` with link, charge, and collision forces to position nodes. Users can drag nodes to rearrange the layout, and hovering highlights a node with a thicker stroke. The data is loaded from a local `data.json` file and rendered using SVG elements.

SSravan1888

86% match

Loading thumbnail…

Social Network Graph - ICE-8

This interactive network visualization maps social connections among ten individuals, such as Suchitra, Rahul, and Cherry, based on friendship links from a local data.json file. Implemented in D3 v6 with SVG rendering, the graph layout is computed using the `d3.forceSimulation` API with link, many-body, collision, and centering forces. Nodes are rendered as large circles with labels, and directed edges include arrow markers to indicate relationship direction. Users can drag nodes to rearrange the network, with hover effects highlighting selected nodes.

Ssuchitra2602

85% match

Loading thumbnail…

ICE8 - Social Network Graph_Ramakanth

A social network graph displays eight people as nodes connected by directed, labeled friendship links, with node size and color kept uniform to emphasize structure. The visualization uses d3.forceSimulation with link, charge, collision, and center forces to position nodes, while draggable circles and arrow markers enhance interactivity. It renders to SVG using d3.v6, loading graph data from a JSON file. Hovering highlights a node with a thick green stroke, and labels appear on each node to identify individuals.

RRamakanth771

85% match

Loading thumbnail…

ICE8 - Social Network

This visualization shows a social network of nine people connected by friendship links, with each person represented as a gold circle labeled with their name. The network is rendered using D3 v6’s `d3.forceSimulation` with link, charge, collision, and center forces to position nodes. Node dragging is enabled via `d3.drag`, and hovering highlights a node with a green border using CSS classes. The data comes from a JSON file listing nodes and links with relationship metadata, drawn as SVG lines with arrow markers.

IIndhuKrishnaraj

85% match

Loading thumbnail…

Social Network Graph --> ICE-8

This example visualizes a small social network as an interactive node-link diagram. The graph shows ten people and the friendship connections between them, with arrowheads indicating link direction. The layout is computed using D3’s `d3.forceSimulation` with `forceLink`, `forceManyBody`, `forceCollide`, and `forceCenter`. Nodes are rendered as large cyan circles with text labels, and users can drag them via `d3.drag`. Data is loaded from a local JSON file, and the SVG is rendered with scaling and marker definitions from D3 v6.

SSravyaAnnadi

85% match

Loading thumbnail…

Social Network Graph ICE-8

This network graph shows the social connections among a group of eight people, with nodes representing individuals and directed links indicating friendship relationships, such as "Friend with." The data is loaded from a JSON file and visualized using D3 v6's `d3.forceSimulation` with `forceLink`, `forceManyBody`, `forceCollide`, and `forceCenter` to position the nodes. The graph is rendered as an SVG, with draggable nodes that react to mouseover and mouseout events. Each connection includes a triangular marker at its endpoint to indicate direction, while node and link colors and styles are defined in a separate CSS file.

KKrishnaPriyaKurra

85% match

Loading thumbnail…

ICE8 - Social Network Graph

This interactive graph visualizes friendship connections among eight people, with nodes representing individuals and directed links showing relationships. The graph uses a force-directed layout to position nodes, and users can drag nodes to rearrange the network. Implemented with D3 v6, it leverages `d3.forceSimulation` with link, charge, collide, and center forces, plus `d3.drag` for interactivity. Node sizes are fixed, and hover highlighting is handled via CSS classes. The data is loaded from a JSON file containing node and link definitions.

LLakshmiVandanaNunna

85% match

Loading thumbnail…

Social Network Graph --> ICE-8

A force-directed social network graph displays ten people connected by twelve friendship links. The visualization uses a pink circular node for each person, with their name displayed inside, and red directed lines with arrowheads showing relationships. The layout is computed using `d3.forceSimulation` with `forceLink`, `forceManyBody`, `forceCollide`, and `forceCenter`. Nodes are interactive via `d3.drag`, and hovering changes the stroke color through CSS classes. Data comes from a JSON file containing nodes and links with relationship metadata.

RRevanthReddyG

84% match