Skip to main content
SimilarExport ZIP
100%

ICE 8-1Q Sadvik

✓ Published0🌍 Public
SSadvik
Last edited Apr 9, 2026
Created on Apr 9, 2026
Forked from D3 Starter

This visualization presents two interactive geographic maps side by side: a world map using the Natural Earth projection and a United States map using the Albers USA projection. The world map colors countries by population (in millions) using a sequential blue interpolator, while the US map shades states by crime rate using a green interpolator. Built with D3 v7 and TopoJSON, both maps load geographic data from CDN-hosted world-atlas and us-atlas JSON files, rendering SVG paths via `d3.geoPath` with hover tooltips displaying country or state names and their corresponding values. Non-highlighted regions appear gray, indicating missing data.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

ICE 8- 1Q Sadvik Kondadi

This example presents two interactive choropleth maps side by side: a world map visualizing population data using a Natural Earth projection, and a United States map displaying crime rates via an Albers USA projection. Both maps use D3 v7 and TopoJSON to render SVG paths, with sequential color scales (blue for population, green for crime) encoding numeric values. Hovering over a country or state triggers a tooltip showing the region name and its corresponding statistic. The code loads GeoJSON from world-atlas and us-atlas packages accessed via CDN.

SSadvik
93% match
Loading thumbnail…

ICE 8 - 1Q Sharanya

This visualization combines a world map and a U.S. map in a single SVG canvas. The world map, using a Natural Earth projection, colors countries by population with a blue sequential scale, while the U.S. map uses an Albers USA projection to depict state-level crime rates in greens. Both maps rely on TopoJSON datasets loaded from `world-atlas` and `us-atlas`, rendered via `d3.geoPath`. The code builds color legends with `d3.scaleSequential` and tooltips for each geographic feature.

Cchengalvasharanya@gmail.com
86% match
Loading thumbnail…

ICE-8

ICE-8 presents a pair of interactive SVG choropleth maps showing world GDP and US state values. The world map projects Natural Earth TopoJSON countries with a Natural Earth projection and uses a green sequential color scale, while the US map uses an Albers USA projection. Both maps use `d3.geoPath`, TopoJSON features, and tooltip interactions. Data is joined from remote CSV sources, with JavaScript fetch and D3’s data loaders handling URL fallbacks.

SSainathreddypotu@gmail.com
85% match
Loading thumbnail…

ICE8_WorldMap_hd

This example presents two interactive SVG maps built with D3 v7 and TopoJSON: a world map showing random population density values and a U.S. map displaying random crime rates. The world map uses a Natural Earth1 projection, while the U.S. map employs an AlbersUsa projection. Both maps encode data through sequential color scales—YlOrRd for density and Blues for crime—applied to country and state polygons via `d3.geoPath`. The code fetches geographic data from world-atlas and us-atlas CDN packages, then appends tooltips with the corresponding random values.

HHarshithaDontha@my.unt.edu
84% match
Loading thumbnail…

ICE 8

This visualization displays a choropleth map of the United States, with each state filled by a categorical color from the D3 category10 scheme. The map uses the geoAlbersUsa projection and renders state boundaries as SVG paths with white strokes via d3.geoPath. It loads US Atlas TopoJSON data from a CDN, extracts state features using topojson’s feature function, and shows state names as tooltips on hover.

66264kusuma@gmail.com
83% match
Loading thumbnail…

ICE 8-1

This visualization displays a world map using the Natural Earth projection, with countries filled in pastel green and separated by white borders. The map loads country boundaries from the world-atlas TopoJSON dataset via d3.json, then converts them to GeoJSON features using topojson.feature. Each country path is rendered as an SVG element through d3.geoPath, and hovering reveals the country name through an appended SVG title tooltip. The code relies on d3.v7 and the topojson library for geographic data handling.

Aanirudhrao345@gmail.com
82% match
Loading thumbnail…

ICE-8 USA Map

This visualization displays a choropleth-style map of the United States using an Albers equal-area conic projection. The map shows landmasses in a light red fill, state boundaries as purple interior lines, and a gray sphere background, with graticule lines. Built with React and D3 v5, the code uses `d3.geoAlbers` for projection, `d3.geoPath` to generate SVG paths, and TopoJSON’s `feature` and `mesh` methods to process US Atlas state data. The map renders at 2000×600 pixels within an SVG container.

Vvidhyanamini
82% match
Loading thumbnail…

ICE8

This visualization displays a world map where each country is colored according to its population using a logarithmic rainbow color scale. The map is rendered as SVG using D3.js v7 with a Natural Earth projection and TopoJSON data loaded from world-atlas. Countries are drawn as paths using d3.geoPath, with colors assigned via d3.scaleSequentialLog and d3.interpolateRainbow based on population values from an embedded dataset. Hovering over a country triggers a tooltip showing additional information.

Ppashamsahithi2391@gmail.com
82% match