Fork of Social Network Graph-ICE-8

100%

Fork of Social Network Graph-ICE-8

✓ Published1🌍 Public

Last edited Apr 12, 2023

Created on Apr 12, 2023

Forked from Social Network Graph --> ICE-8

This interactive social network graph displays the connections between nine individuals, with lines representing friendship links and circles representing people. The visualization uses a force-directed layout, where nodes arrange themselves based on simulated physical forces, and users can drag circles to reposition them. The code leverages D3.js version 6 APIs including `d3.forceSimulation`, `d3.forceLink`, and `d3.forceManyBody` to calculate the layout, while the data is loaded from a JSON file containing node IDs and link relationships. The SVG rendering includes hover effects that highlight nodes with a thicker stroke.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Fork of Fork of Social Network Graph - ICE-8

This interactive social network graph visualizes friendship connections among ten individuals, with nodes representing people and directed links showing their relationships. The D3.js v6 visualization uses a physics-based force simulation, combining `d3.forceLink`, `d3.forceManyBody`, `d3.forceCollide`, and `d3.forceCenter` forces to position nodes with 75-pixel radius circles. Users can drag nodes to explore the network, with hover effects highlighting connections. The SVG rendering displays node labels in orange text, with the data loaded from a JSON file containing relationship weights and person identifiers.

GGvl Naga Saikiran

94% match

Loading thumbnail…

Fork of Social Network Graph --> ICE-8

This visualization shows a social network graph of ten individuals connected by friendship links. Each node is rendered as a circle with a person’s name, and directional arrows on the connecting lines indicate the relationship’s source and target. The layout is computed using `d3.forceSimulation` with `d3.forceLink`, `d3.forceManyBody`, `d3.forceCollide`, and a center force. Nodes are draggable via `d3.drag`, with hover effects toggling a CSS class. Data comes from a local `data.json` file, and the SVG is rendered with D3 v6.

Bbhanuprasadk19

94% match

Loading thumbnail…

Fork of Social_Network_graph_ICE-8

This force-directed network graph visualizes a small social network of nine people and their connections. The visualization uses D3.js (v4) to render SVG circles for individuals and lines for relationships, with line thickness indicating connection weight. The graph implements interactive dragging via the d3.layout.force API. Node labels appear in red text with blue circular markers. Data comes from graph.json, which defines nodes grouped by community and edges with assigned weights. The force layout algorithm positions nodes dynamically based on gravitational and charge parameters.

Mmanishcheruku

93% match

Loading thumbnail…

Fork of Social Network Graph ICE-8

This static SVG network graph visualizes friendships between eight individuals, with nodes positioned by a force-directed simulation and edges representing "Friend with" relationships. The interactive visualization uses d3.forceSimulation with link, many-body charge, collision, and center forces to layout the graph. Nodes are draggable, and hovering highlights them with a green stroke. The data is loaded from a JSON file, and the graph is rendered using D3 v6 with a fixed 960 by 600 pixel viewBox, using circles and lines.

NNaimisha-M

93% match

Loading thumbnail…

Fork of Social Network Graph --> ICE-8

This social network graph visualizes friend connections among ten individuals, using cyan nodes and directed links with arrow markers to show relationships. Built with D3.js v6, the visualization employs force-directed layout algorithms including `d3.forceSimulation`, `d3.forceLink`, `d3.forceManyBody`, and `d3.forceCollide` to arrange the nodes, with drag interactions enabled via `d3.drag`. The data comes from a JSON file containing node and link definitions with relationship metadata, and interactive highlighting is triggered on mouseover events.

SSaiSreya1

93% match

Loading thumbnail…

Fork of ICE-8 (Social Network Graph)

This interactive network graph visualizes a small social network of nine individuals, with green links showing connections and node size and color indicating degree centrality. The force-directed layout, driven by d3.forceSimulation with link, center, and many-body forces, positions nodes while the drag interaction allows users to manually reposition them. Implemented in D3 v5 with SVG rendering, the example uses custom link paths with quadratic Bézier curves and node labels via standard text elements.

Kkollirohit2000

92% match

Loading thumbnail…

Fork of Fork of Social_Network_graph_ICE-8

This interactive force-directed network graph visualizes social connections among nine individuals from a JSON file. Nodes represent people, colored by group, with blue circles and red labels, while black links show relationships with thickness proportional to connection weight. Users can drag nodes to rearrange the layout. The visualization uses the D3.js v4 library with the d3.force layout API to simulate physics-based node positioning within an SVG canvas.

GGvl Naga Saikiran

92% match

Loading thumbnail…

Fork of Social Network Graph --> ICE-8

This social network graph visualizes connections between individuals, with nodes representing people and links indicating friendships. The node labels show the person's name, and each link uses a directional arrow to show the relationship flow, with the line weight reflecting the strength of the connection. The visualization uses D3 v6 with `d3.forceSimulation`, `d3.forceLink`, `d3.forceManyBody`, and `d3.forceCollide` to position nodes in a force-directed layout, reading data from a JSON file. Nodes are rendered as cyan circles with blue strokes, and users can drag them to rearrange the layout.

SSaiSreya1

92% match