deepika-network

100%

deepika-network

✓ Published0🌍 Public

Last edited Apr 13, 2023

Created on Apr 13, 2023

This network graph visualizes a personal social circle, mapping friendships between individuals. It uses a force-directed layout with `d3.forceSimulation`, combining link, charge, collision, and center forces to position nodes. Rendered as SVG, the graph displays yellow circular nodes with labels and directed, purple edges with arrow markers. Interactive features include dragging nodes and highlighting connections on mouseover, which changes the node's stroke to blue. Data is loaded from a local JSON file, defining the nodes and links.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Social Network Graph

This social network graph visualizes relationships among eight individuals, such as Virat and Deepika, with line thickness indicating connection strength. The visualization uses D3.js version 6 and renders as an SVG. It leverages `d3.forceSimulation` with `forceLink`, `forceManyBody`, `forceCollide`, and `forceCenter` to position nodes. Users can drag nodes to explore the network, and hovering highlights a node with a thicker stroke, as defined in the CSS.

CCH SAMPATH

85% match

Loading thumbnail…

Network Graph

This interactive network graph visualizes a social network of friends, with nodes representing individuals and links showing their relationships. The visualization uses force-directed layout through d3.forceSimulation with link, charge, collision, and center forces to position the nodes. Users can drag nodes to rearrange the network. Data is loaded from a local JSON file, and the graph is rendered as SVG elements including circles for nodes and lines for links, with arrow markers indicating relationship direction. Hovering highlights individual nodes.

Hharipriyaa07

85% match

Loading thumbnail…

Network Graph

This network graph visualizes social connections between friends, with nodes representing individuals and links showing relationships where thicker lines indicate stronger ties. The visualization uses a D3.js force simulation (d3.forceSimulation, d3.forceLink, d3.forceManyBody) to position nodes and manage collisions, while drag interactions allow users to manually reposition nodes. Data is loaded from a local graph.json file, and the SVG rendering includes green arrow markers on links, color-coded nodes, and hover effects that highlight selected connections.

SSwapna1915

84% match

Loading thumbnail…

Social Network

This social network graph visualizes friendship connections between people, with each node labeled by name and linked by directed edges using arrow markers. The graph uses a force-directed layout via `d3.forceSimulation` with `forceLink`, `forceManyBody`, `forceCollide`, and `forceCenter` to position nodes and reveal clustering. Nodes are interactive circles with hover effects and dragging support, rendered as SVG using D3 v6’s `select` and `selectAll` APIs. The data is loaded from a JSON file containing nodes and links with relationship metadata.

Ssudeepmamidi

84% match

Loading thumbnail…

Network Graph

This network graph visualizes a social network of individuals and their friendships. Ten nodes represent people, and twelve links show connections, with a thicker line indicating a stronger friendship between "MY3" and "Sudha". The visualization uses a physics simulation to position the nodes, employing `d3.forceSimulation` with link, charge, collision, and center forces for a clear, spread-out layout. SVG rendering is used, and the code defines draggable nodes using D3's drag interaction, with a green arrow marker on each link to show direction. The data is loaded from a JSON file, and node colors are a simple light green.

Vvineelaramulapalli32

84% match

Loading thumbnail…

Network Graph

This visualization shows a social network graph of personal relationships, with nodes representing people and directed links indicating friendships. The graph uses D3’s force simulation (`d3.forceSimulation` with `forceLink`, `forceManyBody`, `forceCollide`, and `forceCenter`) to position the nodes, which appear as large green circles with red labels. Users can drag nodes to rearrange the layout, and arrows on the links indicate the direction of each connection. The data comes from a local `graph.json` file, and the SVG is rendered with custom markers for the arrowheads.

Aanith462@gmail.com

83% match

Loading thumbnail…

Social Network

The visualization displays a social network graph, mapping eight people and their friendships as nodes and connecting lines. It uses D3.js v6 to run a physics-based simulation, employing `d3.forceSimulation` with link, charge, and collision forces to position the nodes. The SVG renders pink links with arrow markers and interactive nodes that enlarge on hover and can be dragged, with data sourced from a local `network.json` file.

HHarshithaAmbilpur

83% match

Loading thumbnail…

Network Graph

A network graph shows social connections among ten individuals, with nodes representing people and lines indicating friend relationships. The graph uses a force-directed layout powered by d3.forceSimulation, with collision detection and charge forces to position the nodes. Nodes are rendered as circles with labels, and links include arrow markers. The visualization is built with D3 v6 and renders to SVG, reading data from a JSON file. Users can drag nodes to reposition them, and hovering over a node triggers a CSS class change for visual feedback.

MManideeprenikindi

83% match