Skip to main content
SimilarExport ZIP
100%

USA MAP ICE 8 Final

✓ Published0🌍 Public
JJustin Roberts
Last edited Mar 25, 2023
Created on Mar 25, 2023

This visualization displays a United States map with state boundaries rendered in tan and outlined in black, with a hover effect that turns each state white. It uses D3 v5 with the `geoAlbersUsa` projection and `geoPath` to draw SVG paths from TopoJSON county data loaded from the us-atlas package. The map is created by selecting all paths and binding them to state features, with a `title` element added for each state to show its name. The interaction is implemented via CSS `:hover` styling rather than JavaScript event handlers.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

USA MAP - ICE 8

This map of the United States visualizes state boundaries as tan-colored polygons on a black background, with a white hover effect to highlight individual states. The visualization is built with D3 v5 and TopoJSON, using the `geoAlbersUsa` projection and `geoPath` to transform geographic data from the us-atlas counties-10m JSON file into SVG paths. State names are retrieved from the TopoJSON feature properties and displayed as tooltips on hover.

JJustin Roberts
93% match
Loading thumbnail…

ICE8 USA Map

This visualization displays a choropleth map of the United States, with state boundaries drawn as SVG paths. The code uses D3 v5’s `geoAlbersUsa` projection and `geoPath` to render geographic features from TopoJSON data loaded from the us-atlas repository. Each state shape is colored with a default fill, and hovering changes the fill color via CSS. State names appear as tooltips using SVG `title` elements, sourced from the TopoJSON feature properties.

BBVNPK001
88% match
Loading thumbnail…

ICE-8-US-Map

This interactive choropleth displays U.S. states as brown SVG paths, colored green on hover, using a geoAlbersUsa projection and d3.geoPath to render geographic features from a TopoJSON dataset loaded from us-atlas via d3.json. The code builds the map with D3 v5 and topojson’s feature method, and adds a title attribute for each state.

AAli Shah Solanki
88% match
Loading thumbnail…

ICE8 USA Map

This visualization displays a map of the United States with state boundaries rendered as blue filled polygons with orange strokes, using the geoAlbersUsa projection via d3.geoPath. It loads TopoJSON data from the US Atlas TopoJSON repository, converts it with topojson.feature, and appends SVG path elements for each state. Hovering over a state changes its fill to red, while geographic graticules are included in the styling. The map is built with D3 v5 and rendered as SVG.

Sshiiva-surya
87% match
Loading thumbnail…

country_map_usa_ice-8

This example displays a choropleth map of the United States, with each state filled with a distinct color from a categorical scale and a hover effect that turns the state white. It uses D3 v7’s `geoAlbersUsa` projection and `geoPath` to render the map from TopoJSON data loaded from the us-atlas CDN. State boundaries are drawn with black strokes, and tooltips showing state names appear via appended `title` elements. The color mapping and hover behavior are implemented with `scaleOrdinal` and CSS `:hover` rules.

Hhossaphul
87% match
Loading thumbnail…

ICE8 USA Map

This example shows a choropleth-style map of the United States, with each state rendered as a red path that turns blue on hover and includes a tooltip with the state name. The map is drawn using D3’s `geoAlbersUsa` projection and `geoPath` generator, fed by TopoJSON state boundaries from the `us-atlas` dataset. The code uses `d3.json` to load the data, `topojson.feature` to extract geometries, and appends SVG paths with CSS-based hover styling.

SSyed Araib Karim
87% match
Loading thumbnail…

ICE8 country Map

This example shows an interactive map of the United States, coloring each state green and highlighting it orange on hover. It uses D3 v5's `d3.geoAlbersUsa` projection and `d3.geoPath` to render state boundaries from a TopoJSON file loaded via `d3.json` from the us-atlas repository. State names appear as tooltips using SVG `title` elements. The map is styled with CSS for hover effects.

RRaja Srinivas Nelluri
87% match
Loading thumbnail…

ICE8 USA Map

This example displays a choropleth-style map of the United States, with each state filled in green and outlined in a semi-transparent orange. It shows the geographic boundaries of all 50 states, highlighting them in red on hover. The visualization uses the D3 v5 library with `d3.geoPath` and `geoAlbersUsa` projection, rendering the map as SVG paths from TopoJSON data loaded from the us-atlas repository. The `states-10m.json` file provides the geographic features, and the `geo-albers-usa-territories` plugin enables territory inclusion.

AAmanullah007
86% match