Fork of Organization Graph Diagram

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

Fork of Organization Graph Diagram

This fork of an organization graph diagram visualizes the network of connections among Kenneth Rainin Foundation grantees, using colored nodes and links to distinguish major organizations from their child projects and leaves. It uses d3.forceSimulation with forceManyBody, forceLink, and forceCenter to compute layout, while SVG circles, lines, and text render the graph with drag interaction. Data is manually defined in data.js, with colors generated via Paletton.

Fork of Organization Graph Diagram

This fork of an organization graph diagram visualizes the network of connections among Kenneth Rainin Foundation grantees, with four main colored nodes (Arts Web, Social Impact Commons, Community Arts Stabilization Trust, and AmbitioUS) linked together and branching into child and leaf nodes. Built with D3 v6, it uses `d3.forceSimulation` with `forceManyBody`, `forceLink`, and `forceCenter` to position nodes, while `drag` enables interactive repositioning. The SVG rendering displays circles sized by node hierarchy and labeled lines colored by parent node, with data defined in a separate module using `export` arrays.

AAxel-Pond

Fork of Organization Graph Diagram

This force-directed graph maps the network of connections among the Kenneth Rainin Foundation’s grantee organizations, with nodes colored by category via generated palettes and sized by hierarchy level. It renders as SVG circles and lines using d3.forceSimulation with forceManyBody, forceLink, and forceCenter, plus drag interaction for repositioning. Node data is assembled programmatically in data.js, defining main, child, and leaf nodes with custom link distances. Labels appear on all named nodes, while unnamed leaves remain unlabeled.

Fork of Organization Graph Diagram

Fork of Organization Graph Diagram

A force-directed network diagram maps connections among Kenneth Rainin Foundation partners, with colored nodes and links grouping related organizations. The visualization uses `d3.forceSimulation` with `forceManyBody`, `forceLink`, and `forceCenter` to position nodes, and renders SVG circles and lines with drag interaction enabled. Data is generated procedurally in `data.js`, with node sizes and link distances varying by hierarchy level, and colors defined in a separate `colors.js` module from paletton.com. The network highlights clusters like Arts Web, Social Impact Commons, and other foundation grantee communities.

Ttkcj0912

Fork of Organization Graph Diagram

A force-directed graph represents the network of connections among the Kenneth Rainin Foundation's grantees. It shows four main organizational nodes — such as Arts Web and AmbitioUS — each with child nodes and many small leaf nodes, linked by colored lines. The visualization uses d3.forceSimulation with forceManyBody and forceLink, rendering SVG circles and text. Node positions update on each tick, and drag interaction lets users reposition nodes. Data is defined in data.js with color palettes from colors.js.

Ccharliemok

Fork of Organization Graph Diagram

A force-directed graph visualization maps the grantee network of the Kenneth Rainin Foundation. Circles sized by hierarchy level—main nodes, child nodes, and leaves—use a custom four-color palette from `colors.js`, with links tinted to match their source. Built with d3.forceSimulation, forceLink, and forceManyBody, the layout positions nodes dynamically, while dragInteraction allows manual repositioning. SVG rendering draws lines, circles, and text labels that update on each simulation tick.