Skip to main content
SimilarExport ZIP
100%

ICE8 USA Map

✓ Published5🌍 Public
AAmanullah007
Last edited Apr 4, 2022
Created on Apr 4, 2022
Forked from Hello Package.json

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.

AI-generated description
MIT Licensed

Similar vizzes

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
94% match
Loading thumbnail…

ICE-8:US Map

This example displays a choropleth-style map of the United States with light green states outlined in orange on a light blue background. It uses d3.geoPath with a d3.geoAlbersUsa projection to render the map, and topojson.feature to extract state boundaries from the US Atlas states-10m.json dataset. The visualization is drawn as an SVG with a fixed width and height, with each state path filled and stroked directly.

RRebecca Moore
94% 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
93% match
Loading thumbnail…

ICE-8 USA Map

This example shows a choropleth-style map of the United States, where land areas are filled in purple over a light blue sphere, with red state boundaries drawn on top. Using the Albers equal-area conic projection from d3.geoAlbers and rendering paths with d3.geoPath, the visualization displays both the nation outline and the mesh of state borders. The data is loaded from the us-atlas TopoJSON file, with geoGraticule available for graticule overlays, and the component is built with React and rendered as SVG.

Ssowmyanagula@my.unt.edu
93% 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
93% 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
93% 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
92% 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
92% match