Skip to main content
SimilarExport ZIP
100%

Three spheres

✓ Published0🌍 Public
CConorAspell
Last edited Nov 27, 2017
Created on Nov 27, 2017

An interactive network diagram visualizes the connections between individuals in Hillary Clinton’s email network, using six centrality metrics—betweenness, degree, eigenvector, closeness, harmonic, and communicability—to determine node prominence. Users switch metrics via AngularJS buttons, which update the graph’s layout and node emphasis. The visualization is built with D3.js v4 and AngularJS, pulling node and edge data from a JSON file containing centrality scores for each person. The graph displays nodes as spheres, with positions and sizes reflecting the selected metric’s value.

AI-generated description

Built with blockbuilder.org

mit Licensed

Similar vizzes

Loading thumbnail…

"What Happened" by Hillary Clinton

This network graph maps the connections among U.S. political figures from Hillary Clinton’s 2016 presidential campaign, based on a JSON dataset with node centrality metrics. Rendered in SVG with D3 v4, the visualization uses node size and color to encode centrality and group membership (e.g., candidate, opponent), while the "Hillary" node dominates with the highest degree, betweenness, and eigenvector centrality, illustrating her structural role in the narrative. Links encode relationships between individuals, with layout revealing clusters of allied groups.

CConorAspell
74% match
Loading thumbnail…

Network map

This network map visualizes a small LinkedIn-style social graph, showing eight people as labeled circles and their connections as orange weighted lines. The graph uses a force-directed layout with D3’s `d3.layout.force()` to position nodes, with gravity, charge, and distance parameters controlling the spacing. The HTML/SVG canvas is built with `d3.select`, and node positions are updated on each tick via the force layout’s `on("tick")` event, while link thickness reflects the `weight` field from the JSON data.

SSaikiran2029
70% match
Loading thumbnail…

HillaryBlock

This visualization shows the network of characters from the Lord of the Rings, with nodes arranged in a force-directed layout and sized by degree centrality. Each character is represented as a circle, colored by community group, with edges linking frequent co-occurrences. Hovering highlights neighboring connections and reveals a tooltip with the character's name, race, and centrality measures. Built with D3 v4 and rendered as SVG, the graph uses force simulation to position nodes, while node size encodes degree centrality and color encodes community membership. The dataset is derived from a JSON of the LOTR character co-occurrence network, made available under the MIT license.

CConorAspell
70% match
Loading thumbnail…

Untitled

This interactive network diagram visualizes a graph of interconnected entities, displaying nodes as either circles or squares with sizes and colors that map to a numerical score. The graph reveals a clustered structure where a central node connects to all others. The visualization uses D3.js v3 with an SVG rendering and a force-directed layout (`d3.layout.force`). Node appearances and link colors encode the score values, while mouse interactions highlight connected nodes and allow dragging.

Xxsg13
69% 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
68% match
Loading thumbnail…

Network chart

This network chart visualizes a small social graph of seven individuals across four groups, with links between them weighted to indicate relationship strength. The visualization uses a force-directed layout to position nodes, with each node rendered as a circle accompanied by a text label. The code employs the `d3.layout.force` API from D3 v4 to simulate the physical forces that arrange the nodes, and users can click and drag nodes to reposition them. Links are drawn as lines with stroke widths proportional to the weight data from the `graphFile.json` source, and the SVG canvas is styled with a tan background and green node circles.

Eeravellisaimeghana
68% match
Loading thumbnail…

Network chart

This network chart visualizes a small social graph of seven individuals across four groups, with links between them weighted to indicate relationship strength. The visualization uses a force-directed layout to position nodes, with each node rendered as a circle accompanied by a text label. The code employs the `d3.layout.force` API from D3 v4 to simulate the physical forces that arrange the nodes, and users can click and drag nodes to reposition them. Links are drawn as lines with stroke widths proportional to the weight data from the `graphFile.json` source, and the SVG canvas is styled with a tan background and green node circles.

Eeravellisaimeghana
68% match
Loading thumbnail…

activity 8- network

This interactive network graph visualizes a social network of ten people, with circular nodes representing individuals and directed blue lines with markers indicating friendships. The visualization uses D3.js v6 with its force-directed simulation API (`d3.forceSimulation`) to position nodes, applying link, many-body, collision, and centering forces. Data is loaded from a local JSON file, rendered as an SVG, and styled with CSS. Nodes are draggable, and hovering highlights connections through a focus class.

Mmandadi1999
68% match