ICE 8-1.2

100%

✓ Published0🌍 Public

Last edited Nov 10, 2025

Created on Nov 8, 2025

This choropleth map displays the crime rate per 100,000 people across U.S. states, using a sequential blue color scale where darker shades indicate higher rates. Hovering over a state reveals a tooltip with the exact value, while states without matching data appear gray. The visualization loads CSV data and U.S. TopoJSON boundaries, then renders them as SVG paths via `d3.geoPath` with an Albers USA projection. It uses D3 v7 for data binding, color encoding, and interactive tooltips, with state names normalized and matched against FIPS codes for labeling.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

maps

This choropleth map shows U.S. state crime rates per 100,000 people, with states colored on a sequential orange-red scale based on values loaded from a CSV file. The visualization uses D3 v7 and TopoJSON to render state boundaries via `d3.geoAlbersUsa` projection and `d3.geoPath`, while encoding data with `d3.scaleSequential` and `d3.interpolateOrRd`. A canvas-generated gradient legend with a `d3.axisBottom` scale accompanies the SVG map, and hover interactions display crime values and state names in a tooltip.

Vvydeeshm@gmail.com

87% 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

87% match

Loading thumbnail…

ICE8 USA Map

A choropleth-style map of the United States renders each state as an SVG path, colored with a categorical scale and labeled with its name at the centroid. Hovering turns a state red via CSS. The code loads TopoJSON state boundaries from the us-atlas package and uses `d3.geoAlbersUsa` for projection, `d3.geoPath` to generate paths, and `d3.scaleOrdinal` with `schemeCategory10` for fill colors.

Ggeethikal

86% match

Loading thumbnail…

ICE8-Country map

This choropleth-style map displays all 50 US states using an orange fill with black state boundaries, highlighting individual states in green when hovered. The visualization loads geographic data from a TopoJSON file via `useData()`, then renders it as SVG paths using `d3.geoPath()` with the `geoAlbersUsaTerritories()` projection. Built with React and D3 v5, the code integrates TopoJSON's `feature()` and `mesh()` functions to generate land polygons and interior borders.

KKolliTeja

85% match

Loading thumbnail…

ICE 8-2

A choropleth map of the United States displays population density in people per square kilometer, using a yellow-to-red sequential color scale for each state. The map uses an Albers USA projection with `d3.geoPath`, loading state boundaries as TopoJSON from the us-atlas package. State names and density values appear as labels for the most densely populated regions, and a gradient legend at the bottom right maps color to density values. Tooltips on each state show its name and population density on hover.

Aanirudhrao345@gmail.com

85% match

Loading thumbnail…

US Crime Rate Map

A choropleth map of the United States displays per-state crime rates using a sequential color scale from light pink to dark red. Hovering over a state highlights its border and reveals a tooltip with the state name and crime rate. The visualization uses D3 v7 and topojson to load US Atlas GeoJSON data, projecting it with `d3.geoAlbersUsa` and rendering paths via `d3.geoPath`. Crime values are mapped to colors using `d3.scaleQuantize`, with mouse events and a tooltip div providing interaction.

Sshreshnaanugu@gmail.com

85% match

Loading thumbnail…

11540639 ICE 8-Country Map

This choropleth map displays U.S. states rendered as sky-blue land masses with green internal borders, using an Albers USA projection that includes territories. The visualization loads geographic data from a TopoJSON URL and processes it with `topojson.feature` and `topojson.mesh`, then draws the paths using `d3.geoPath`. Built with React, the app fetches data asynchronously in a custom `useData` hook and conditionally renders the SVG after loading completes, leveraging d3.v5 for geographic calculations.

SSravanthi Silla

84% match

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.

Ssakethgoud333@gmail.com

84% match