Fork of Organization Graph Diagram

100%

Fork of Organization Graph Diagram

✓ Published0🌍 Public

Last edited Oct 14, 2021

Created on Oct 14, 2021

This visualization displays a network of connections between organizations funded by the Kenneth Rainin Foundation, with nodes representing main entities, child nodes, and unlabeled leaf nodes. The graph uses d3.forceSimulation with forceManyBody and forceLink to position nodes dynamically, while links are colored to match their source nodes. Node colors are generated from a palette in colors.js, and the SVG rendering updates positions on each simulation tick. Users can drag circles to interact with the graph, and clicking a node triggers the addition of a new main node.

AI-generated description

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

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Organization Graph Diagram

This visualization uses a force-directed graph to map organizational connections within the Kenneth Rainin Foundation’s network. Nodes represent main entities, child organizations, and leaf nodes, with links showing relationships between them. The code employs `d3.forceSimulation`, `forceManyBody`, `forceLink`, and `forceCenter` to position elements, while SVG circles, lines, and text render the data. Node colors and sizes are defined in a separate data file, and drag interactions use d3’s `drag` behavior to let users reposition nodes dynamically.

DDarren Kay

96% match

Loading thumbnail…

Fork of Organization Graph Diagram

A force-directed graph visualizes the network of organizations connected to the Kenneth Rainin Foundation. Color-coded nodes represent the foundation and its partners, with larger main nodes and smaller child and leaf nodes arranged through simulation. The visualization uses D3 v6 with `d3.forceSimulation`, `forceManyBody`, `forceLink`, and `forceCenter` to position elements, while links and circles are rendered as SVG. Node data and colors are defined in separate JavaScript modules, and the graph supports dragging to reposition nodes interactively.

YYedrup

96% match

Loading thumbnail…

Fork of Organization Graph Diagram

This network graph shows connections between organizations in the Kenneth Rainin Foundation’s ecosystem, with four main nodes branching into child organizations and smaller leaf nodes. The visualization uses d3.forceSimulation with forceManyBody, forceLink, and forceCenter to position nodes, while drag interaction lets users manually reposition them. Links are drawn as SVG lines, nodes as circles, and labels as text elements. The code uses d3.v6, with node sizes and link distances encoding hierarchy and colors from a generated palette.

Ttonkaski

96% match

Loading thumbnail…

Fork of Organization Graph Diagram

A network graph visualizes the connections between organizations funded by the Kenneth Rainin Foundation, with four main nodes branching into smaller child nodes and leaf circles. The diagram uses SVG circles and lines colored by cluster, with text labels for named organizations. Built with D3 v6, the visualization relies on `d3.forceSimulation` with `forceManyBody`, `forceLink`, and `forceCenter` to compute the layout. Users can drag nodes via d3.drag, which fixes their position and restarts the simulation.

RRoland

95% match

Loading thumbnail…

Fork of Organization Graph Diagram

This visualization shows the organizational network of the Kenneth Rainin Foundation, with four main funding entities connected to smaller partner organizations and leaf nodes. The graph uses d3.forceSimulation with forceManyBody, forceLink, and forceCenter to position nodes, with node size distinguishing main, child, and leaf levels. Draggable circles and text labels are rendered as SVG elements, while link distances and colors are configured per edge in the data specification.

Ssharfudeen

95% match

Loading thumbnail…

Fork of Organization Graph Diagram

A force-directed network diagram maps connections among organizations affiliated with the Kenneth Rainin Foundation, grouping related entities around larger main nodes with smaller child and leaf nodes. The visualization uses d3.forceSimulation with forceManyBody, forceLink, and forceCenter to compute node positions, while links are drawn as colored SVG lines based on a color palette generated via Paletton. Node labels appear as SVG text, and a drag interaction lets users reposition nodes to explore the graph dynamically.

AAzazello13

95% match

Loading thumbnail…

Fork of Organization Graph Diagram

This visualization shows the network of organizations connected to the Kenneth Rainin Foundation, using a force-directed graph with colored nodes and links. D3’s `forceSimulation`, `forceManyBody`, `forceLink`, and `forceCenter` arrange the nodes, while a drag interaction lets users reposition them. The SVG rendering uses circles for nodes, lines for links, and text labels, with node size distinguishing main organizations, child nodes, and leaves. The data is defined in a separate `data.js` file, and colors are generated from Palette.

YYing-Liu21

95% match

Loading thumbnail…

Fork of Organization Graph Diagram

This fork of an organization graph diagram visualizes the network of connections within the Kenneth Rainin Foundation, using a force-directed layout with colored main nodes, child nodes, and leaf nodes. The visualization employs d3.forceSimulation, forceManyBody, forceLink, and forceCenter to position nodes and links dynamically, with drag interaction enabled. Data is generated programmatically in data.js with custom node sizes and distances, while colors come from a paletton.com-generated palette. The SVG rendering updates positions on each simulation tick, with text labels for main and child nodes.

SSg2041

95% match