Graph Test

100%

✓ Published0🌍 Public

Last edited Oct 25, 2021

Created on Oct 11, 2021

This graph diagram visualizes the network of connections within the Kenneth Rainin Foundation, representing predicates, referents, and groups as colored rectangular nodes. The visualization uses D3.js v6 with `forceSimulation` to position nodes, `forceManyBody` for repulsion, `forceLink` for edge constraints, and `forceCenter` for layout anchoring. Nodes are rendered as SVG rectangles with drag interactions, while links appear as lines between connected elements. The data is defined programmatically in data.js, with a custom color palette generated via Paletton.

AI-generated description

A graph diagram representing the network of connections of the Kenneth Rainin Foundation.

MIT Licensed

Similar vizzes

Loading thumbnail…

Graph network reference

A force-directed graph shows the network of organizations connected to the Kenneth Rainin Foundation, with four main nodes branching into smaller child nodes and leaf nodes. The visualization uses `d3.forceSimulation` with `forceManyBody`, `forceLink`, and `forceCenter` to position elements, rendered as SVG circles and lines with labels. Dragging nodes via the `drag` interaction updates their fixed positions. Node colors are sourced from a palette in `colors.js`, and link distances vary by hierarchy level.

MMax Davydenko

88% match

Loading thumbnail…

Network Graph Diagram

This example uses a network graph diagram to visualize connections within the Kenneth Rainin Foundation, displaying both main nodes and child nodes. Built with D3.js v6, it uses `d3.forceSimulation` with `forceManyBody`, `forceLink`, and `forceCenter` to position nodes that are rendered as SVG circles, with text labels for names. Links are drawn as lines, and the graph is interactive, supporting drag-and-drop via the `drag()` behavior and zooming through the `zoom()` handler. The data is defined in JavaScript, with node colors indicating checked status.

Ssrivalliwuyyuru

88% match

Loading thumbnail…

test

This network graph displays the connections among Kenneth Rainin Foundation initiatives, including Arts Web, Social Impact Commons, Community Arts Stabilization Trust, and AmbitioUS, each with child nodes representing partner organizations. The visualization uses D3 v6’s `forceSimulation` with `forceManyBody`, `forceLink`, and `forceCenter` forces to position nodes, while user interaction via `drag` lets viewers move nodes. Node and link colors come from a generated palette in `colors.js`, and the SVG rendering shows circles sized by node hierarchy and text labels.

RRahel Gunaratne

88% match

Loading thumbnail…

Graph

A network graph displays an organizational chart for the Kenneth Rainin Foundation, with colored circular nodes representing departments like Coordinacion, Comercial, and IT, connected by colored links. Node size indicates hierarchy, from large main nodes to small leaf nodes. The visualization uses d3.forceSimulation with forceManyBody, forceLink, and forceCenter to position elements. Users can drag nodes via d3.drag, which updates their fixed positions and restarts the simulation. Data is defined in external JavaScript modules, with colors sourced from Paletton.

Mmyoung1032

87% match

Loading thumbnail…

Fork of Organization Graph Diagram

This graph diagram visualizes the network of connections for the Kenneth Rainin Foundation, with nodes representing individuals and links showing their relationships. The visualization uses D3.js version 6.2.0, specifically leveraging the `d3.forceSimulation` API to drive a physics-based layout with force-directed algorithms including `forceManyBody`, `forceLink`, and `forceCenter`. The SVG rendering displays the graph on a 960x960 canvas. Color schemes are defined in a separate module generated with Paletton, providing distinct palettes for different categories.

DDaniel Tkach

87% match

Loading thumbnail…

Organization Graph Diagram

This interactive organization graph shows the network of connections between Kenneth Rainin Foundation grantees, with four main nodes branching into child nodes and leaf nodes. Built with D3 v6 and SVG rendering, the visualization uses `d3.forceSimulation` with `forceManyBody`, `forceLink`, and `forceCenter` to position nodes, while drag interaction lets users rearrange the layout. Node size and color encode hierarchy levels, and edges display distinct colors per main cluster.

Zzyniax

87% match

Loading thumbnail…

Fork of Organization Graph Diagram

This graph diagram visualizes the network of connections within the Kenneth Rainin Foundation, using four colored main nodes with child nodes and leaf nodes to represent organizational relationships. Built with D3.js v6, it employs `d3.forceSimulation` with `forceManyBody`, `forceLink`, and `forceCenter` to position nodes, while SVG circles, lines, and text render the structure. The data is generated programmatically in `data.js` from a color palette defined in `colors.js`, with drag interactions enabled via D3's `drag` function.

SSteinarV-design

87% match

Loading thumbnail…

Organization Graph Diagram

This interactive network diagram visualizes the organizational connections within the Kenneth Rainin Foundation, using a force-directed layout to show relationships between four main entities and their associated sub-organizations. The SVG renders nodes as colored circles sized by hierarchy level—large main nodes, medium children, and small leaves—with connecting lines colored to match their parent node. The visualization uses d3.forceSimulation with forceManyBody, forceLink, and forceCenter to compute the physics-based layout, while a custom drag interaction allows users to reposition nodes with the simulation restarting automatically. Data comes from a hardcoded JavaScript file defining the node hierarchy and link distances.

CCurran Kelleher

86% match