ICE8Net

100%

✓ Published0🌍 Public

Last edited Nov 9, 2025

Created on Nov 9, 2025

ICE8Net visualizes family relationships among biblical figures using a force-directed network. Nodes represent people, color-coded by generation, while links depict spouse versus parent connections with distinct stroke colors. The visualization employs D3.js v7’s `d3.forceSimulation()` with link, charge, and centering forces, rendering as SVG with draggable nodes and labels. The data is hardcoded in the script, showing Abraham, Sarah, Hagar, and their descendants across four groups.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

ICE8 NETWORK plot

A network diagram visualizes family relationships across generations, with colored nodes representing people and links connecting parents to children. The graph uses D3 v7 and an SVG renderer, loading data from a CSV file, and applies a force-directed layout driven by `d3.forceSimulation` with link, charge, center, and collide forces. Nodes are draggable via `d3.drag`, and hovering displays a tooltip showing each person’s name and generation number.

Ddiwashhumagain@my.unt.edu

84% match

Loading thumbnail…

ICE8Atree

This D3.js visualization presents the family lineage of Abraham, tracing descendants from Abraham himself through Isaac and Jacob down to the Twelve Tribes of Israel. The data is hardcoded as a nested JSON hierarchy, which is processed by `d3.hierarchy` and laid out using the `d3.tree()` algorithm to compute node positions. The SVG rendering uses circles and rectangles for nodes, differentiated by depth with gold, orange, red, and green fills, while connecting links are drawn with `d3.linkVertical()`.

Ddandamidhun41613@gmail.com

84% match

Loading thumbnail…

Fork of ICE-8 NETWORK

This example presents a family relationships network as an interactive force-directed graph. It shows individuals as draggable nodes and parent–child connections as links, with node color indicating generation depth. The visualization uses D3 v7’s `d3.forceSimulation` with link, charge, center, and collide forces, and loads CSV data from a GitHub Gist to build the hierarchy via `d3.stratify`. SVG rendering displays nodes, links, and labels, with a hover tooltip for additional information.

Sskmriyaz0786@gmail.com

82% match

Loading thumbnail…

ICE_8_NIRUPAMA_NETWORK

This interactive network visualizes a family tree, mapping parent-child relationships from a CSV dataset loaded from a GitHub Gist. It uses a force-directed layout with d3.forceSimulation, incorporating forces for links, charge, centering, and collision. Node colors encode generation level, determined using d3.stratify, and draggable nodes with hover tooltips enhance exploration. The visualization is rendered in SVG using D3.js v7.

NNirupama Karanam

81% match

Loading thumbnail…

Network Visualization (ICE-8)

This example visualizes a family tree as an interactive network graph in SVG, using colored nodes to distinguish grandparents, parents, and children. Force-directed layout via `d3.forceSimulation` with link, charge, and center forces positions the nodes, while links represent familial relationships. Nodes are draggable, and a legend maps roles to colors. The code uses D3 v7, applies drag behavior, and renders labels directly on each node.

Ssowjanya

81% match

Loading thumbnail…

ICE 8 Network Graph

This example visualizes a hierarchical family tree as an interactive network graph, with a central parent node (Ramana) and its direct and indirect child nodes (Jaggu, Sonu, Anu, Vinay, and Jaggu’s children Usha and Vyshnavi). The visualization uses d3.forceSimulation to apply many-body repulsion, link forces, and centering forces, positioning nodes and connecting them with lines. Circles and labels are rendered via SVG, with node sizes and colors predefined in a palette. The simulation updates node positions on each tick, demonstrating a simple force-directed layout.

KK V VINITHA

80% match

Loading thumbnail…

ICE8 Family Tree

This interactive visualization displays a multi-generational family tree, using colored circular nodes to represent each family member and curved paths to show parent-child connections. The chart is built with D3.js v5, employing the `d3.stratify()` and `d3.tree()` layout functions to structure the data and position nodes. Node colors vary by depth, with red for the root, blue for the first generation, green for the second, and yellow for the third. The tree is rendered as an SVG, with labels placed next to each node to identify individuals.

BBVNPK001

80% match

Loading thumbnail…

ICE - 8 Family Tree

The ICE – 8 Family Tree is a static hierarchical visualization of familial relationships, rendered as an SVG tree with red nodes connected by lime-green paths. It displays a branching structure from a root ancestor down through multiple generations, with each person’s name labeled in blue text inside their node. The code uses d3.stratify() to convert flat parent-child data into a tree hierarchy and d3.tree() to compute layout positions. Paths between nodes animate via d3 transitions, while circles representing individuals transition to their final radius, creating a lively reveal of the family structure.

Ppavan0828

80% match