Skip to main content
Log in
S

sakethgoud333@gmail.com

@saketh2305·4 public vizzes

Loading thumbnail…

Fork of ICE 8 - STEP 2(B) - VISUALIZING NETWORKS

This example shows a small friendship network among seven students in a study group, using a force-directed layout to position nodes and links. The D3.js code uses `d3.forceSimulation` with `d3.forceLink`, `d3.forceManyBody`, and `d3.forceCenter` to compute the layout, while nodes are rendered as SVG circles and labels as text. Links are drawn as gray lines, and nodes are colored with `d3.schemeSet2`. The simulation updates positions on each tick, and nodes can be dragged with `d3.drag` to explore the network interactively.

Nov 10, 2025
Loading thumbnail…

ICE 8 - STEP 2 (A) - Family Tree

This example shows a four-generation family tree, using a vertical tree layout to display relationships from great-grandparents down to the third generation. The visualization encodes each generation with a distinct color for its circular nodes, and labels each member by name. The code builds the hierarchy with `d3.stratify`, then lays it out with `d3.tree()` and draws the edges using `d3.linkVertical()`. Node relations are defined in a hardcoded data array, and the SVG output includes all text and circles.

Nov 10, 2025
Loading thumbnail…

ICE 8 PART 1 CRIME RATE

This map visualizes homicide rates per 100,000 people for selected countries, using a red sequential color scale from light to dark to indicate increasing crime severity. Hovering over a country displays a tooltip with its name and specific rate, while nations without data appear grey. The visualization uses d3.geoNaturalEarth1 for projection, d3.geoPath for rendering country outlines from TopoJSON data via topojson.feature, and d3.scaleSequential with an interpolateReds interpolator. Interactivity relies on D3 event handlers for mousemove and mouseout, with the map rendered as an SVG.

Nov 10, 2025
Loading thumbnail…

ICE 8 (1)

This choropleth map displays approximate population data for select countries, with values in millions encoded through a sequential blue color scale. Countries without data appear in gray. The visualization uses d3.geoNaturalEarth1 for projection, d3.geoPath for rendering geographic features from TopoJSON data, and d3.scaleSequential with d3.interpolateBlues for color mapping. Interactive tooltips appear on mouse movement, showing each country’s name and population value. A simple legend accompanies the SVG rendering.

Nov 10, 2025