Skip to main content
SimilarExport ZIP
100%

ICE 8 Social Network

✓ Published0🌍 Public
SSushmareddy-gudipally
Last edited Apr 4, 2022
Created on Apr 4, 2022

This visualization shows a small social network of seven people, with names like Narsimha, Raji, and Priya, represented as purple circles connected by pink links whose thickness reflects interaction weight. The code uses the D3.js v4 library and the `d3.layout.force` API to position nodes and enable dragging. Data comes from a local `data.json` file, and the graph is rendered as an SVG with circles, labels, and lines.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

ICE8 - Social Network Graph

This interactive network graph visualizes social connections among nine individuals, with undirected links representing friendship and each node labeled with a person's name. The graph uses a physics-based layout via D3's `forceSimulation`, incorporating link, many-body charge, collision, and center forces to position nodes. Users can drag nodes to rearrange the network, with hover highlighting indicating the selected node. The data comes from a JSON file, rendered as SVG circles and lines.

PPriyanka7002
89% match
Loading thumbnail…

ICE 8 Social Network Graph

This example visualizes a social network of six individuals, with nodes grouped by community and linked by weighted connections. The graph shows relationships between people like Noampi, Akruti, and Priya, using light green lines and pink circles. The visualization loads data from a JSON file and uses the older `d3.layout.force` API (not `d3.forceSimulation`) to simulate physics, with node positions updated on tick events. Text labels display names, and users can drag nodes to rearrange the network. The SVG rendering is handled directly through D3 selections.

AAkrutiKhurana2103
89% match
Loading thumbnail…

ICE-8: Social Network

A small social network graph displays six named individuals connected by weighted links, with line thickness reflecting relationship strength. The visualization uses a force-directed layout created with the d3.layout.force API in d3.v4, rendering nodes as blue circles with labels in an SVG canvas. Data is loaded from a local JSON file containing node names, group assignments, and link weights. Node positions update dynamically through the force simulation’s tick handler, while drag behavior is enabled via force.drag.

SSreejaBellamkonda
89% match
Loading thumbnail…

ICE 8- social Network graphic

This example shows a small social network of six people connected by weighted links, with node labels displayed next to circular markers. The visualization uses D3 v4’s force layout to position nodes and links, with link stroke width proportional to the weight of each connection. Users can click and drag nodes to rearrange the network. The data is loaded from a local JSON file, and the chart is rendered as SVG, with purple links and pink nodes styled via CSS.

Ssowmyanagula@my.unt.edu
88% match
Loading thumbnail…

ICE 8 social Network graphic

This force-directed network graphic maps a small social graph of seven named individuals, with node size and link thickness encoding relationship weight from a JSON file. Built using `d3.layout.force`, it applies gravity, charge, and distance parameters to position nodes, rendering them as orange SVG circles with labeled text and black links. Users can drag nodes interactively via `force.drag`, while the tick handler updates link coordinates and node transforms. The visualization highlights the connections between V.V.R Narsaiah and his network, using `Math.sqrt(d.weight)` for stroke-width to show stronger ties like the repeated Rocky links.

VVAbhiram99
88% 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
88% match
Loading thumbnail…

ICE-8 Social Network

This visualization displays a social network graph representing the relationships among nine individuals, with nodes connected by weighted links. The code uses d3.layout.force (the v3-style force layout) to position nodes, with link thickness based on the square root of each connection's weight. Circles and text labels are rendered as SVG elements, and users can drag nodes to rearrange the layout. A yellow tooltip appears on hover to show each person's name, while the force simulation continuously updates node and link positions.

AAbhinav-Mullapudi
88% match
Loading thumbnail…

ICE-8_Social_network

This example visualizes a small social network of eight people and their friendship connections using a force-directed graph. Pink circular nodes represent individuals, while black lines with arrowheads depict the "Friend with" relationships between them. The layout is computed with `d3.forceSimulation`, applying link, charge, collision, and center forces to position nodes dynamically. Users can drag nodes to rearrange the network, and hovering highlights a node with a distinct stroke. The visualization renders in SVG using D3 v6, with data loaded from a local `data.json` file.

NNiharika-Guthikonda
88% match