Skip to main content
SimilarExport ZIP
100%

CSCE 5320 Assignment 8

✓ Published0🌍 Public
SStorm
Last edited Apr 12, 2026
Created on Apr 12, 2026

This interactive visualization gallery presents three distinct D3.js v7 views: a choropleth US population map using `d3.geoPath` and `d3.geoAlbersUsa` with TopoJSON state boundaries and census data, an animal taxonomy tree drawn with `d3.tree` and `d3.linkHorizontal`, and a static movie-actor network laid out via `d3.forceSimulation`. Buttons switch between views, and hover tooltips appear on the map. The network nodes and links are rendered as SVG circles and lines, with colors distinguishing movies from actors.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

ice82

This example presents hierarchical population data as an interactive tree and network visualization. Buttons toggle between a `d3.tree` layout showing parent-child relationships with node sizes scaled by population, and a `d3.forceSimulation` network view with draggable nodes and link lines. The code uses D3 v7 with SVG rendering, drawing colored circles and labels for world regions and countries from embedded sample data.

Ssdarsi2404@gmail.com
76% match
Loading thumbnail…

ICE-8

ICE-8 is a multi-view visualization suite exploring four distinct chart types: a research collaboration force-directed network, a programming languages tree, a choropleth map of US state populations, and an interactive world map. The network uses `d3.forceSimulation` with draggable nodes; the tree uses `d3.stratify` and `d3.tree` with colored generation levels; the US map leverages `d3.geoAlbersUsa` and `topojson-client` with a sequential color scale; and the world map uses `d3.geoNaturalEarth1` with hover highlighting. Each view loads data from CDN-hosted TopoJSON files.

CCharith Kapuluru
75% match
Loading thumbnail…

CSCE 5320 Assignment 7

This interactive visualization explores video game sales data through four coordinated charts: a scatter plot of regional sales, a pie chart of genre shares, a line chart, and an area chart of global sales over time. Users switch between views using buttons. Built with D3 v6, the example uses `scaleLinear`, `axisLeft`, `axisBottom`, `pie`, `arc`, `line`, and `area` APIs. The scatter plot employs `scaleOrdinal` with `interpolateRainbow` for genre colors, while the line and area charts aggregate data via `rollup` and `sum` from a TSV dataset.

SStorm
75% match
Loading thumbnail…

ice8_task2

A dark-themed visualization gallery presents two interactive D3 v7 diagrams: a hierarchical tree of programming languages and a force-directed network of authors and papers. The tree uses `d3.hierarchy` and `d3.tree` to arrange nodes by depth, with shapes varying by level and colors by layer, while hover highlights links. The network uses `d3.forceSimulation` with link, charge, and center forces, representing authors as circles and papers as squares, with drag repositioning and tooltips. Both render as SVG with original data.

Kkmohithkumar7@gmail.com
75% match
Loading thumbnail…

dinesh ice8 q1

This example presents a dual-map visualization: a world choropleth and a US states choropleth, rendered as SVG using D3.js v7. The world map uses `d3.geoNaturalEarth1` projection and color-coded countries based on population data from a CSV file, while the US map uses `d3.geoAlbersUsa` projection with state-level values. Both maps load GeoJSON from the world-atlas and us-atlas CDN packages, and use `topojson-client` functions `feature` and `mesh` for geometry processing. A hover tooltip displays values; the US section also includes state borders drawn via a mesh layer.

Ddineshsingiri18@gmail.com
74% match
Loading thumbnail…

ICE-8 assignment

This example presents two complementary D3.js visualizations: a hierarchical family tree and a force-directed social network. The family tree uses a `d3.tree` layout with `d3.linkHorizontal` curves to connect nodes representing three generations. The social network applies `d3.forceSimulation` with `d3.forceLink`, `d3.forceManyBody`, and `d3.forceCenter` to position seven interconnected individuals, with draggable nodes. Both visualizations render as SVG elements, and the force graph includes labels beside each node, allowing users to explore relationships through interactive dragging.

BBHUMIKA CHUNDU
74% match
Loading thumbnail…

React & D3 Vibecoding Starter

This example displays a choropleth map of the United States, where state fill darkness corresponds to population values from a small inline dataset. It uses D3 v7 and topojson-client to load and convert US Atlas TopoJSON into GeoJSON features, then renders them as SVG paths via `d3.geoPath` and a `d3.geoAlbersUsa` projection. A `d3.scaleLinear` maps population extents to a blue color range, with unlisted states shown in gray. Hovering reveals a tooltip with each state's name and population via an appended `<title>` element.

SSathviKankanala@my.unt.edu
73% match
Loading thumbnail…

A9 - Geospatial visualization in D3

This gallery entry presents three distinct D3.js geospatial visualizations created by Duc Pham for a CS 360 assignment. The first is a choropleth map, followed by a proportional symbols map, and finally a world choropleth map that includes tooltips for all three parts and highlights the top 10 countries in part two. The visualizations use the D3 library to render geographic data, with interactive elements such as tooltips and highlighting. The code is structured within an HTML page using CSS and JavaScript, and each visualization is linked to its own VizHub instance for embedding and viewing.

DDuc Pham
73% match