Skip to main content
SimilarExport ZIP
100%

Fork of ICE8 USA Map

✓ Published0🌍 Public
Ffouzanuddin
Last edited Apr 5, 2022
Created on Apr 5, 2022
Forked from ICE8 USA Map

This fork of the ICE8 USA Map displays a choropleth of U.S. states, colored in light sea green with hover states highlighting each state in orange-red. It renders an SVG map using D3 v5, the `geoAlbersUsa` projection, and `d3.geoPath` to draw state boundaries from TopoJSON data loaded from the us-atlas repository. State name tooltips appear on hover via appended `title` elements. The code imports `select`, `json`, `geoPath`, and `geoAlbersUsa` from D3, along with `feature` from TopoJSON.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of ICE8 USA Map

This fork of the ICE8 USA Map displays a choropleth of U.S. states, each filled with a categorical color from the `d3.scaleOrdinal` / `d3.schemeCategory10` palette and labeled with its name. It uses `d3.geoPath` with the `geoAlbersUsa` projection to render state boundaries from the `us-atlas` states-10m TopoJSON file, with `topojson.feature` extracting the state features. State names are placed at polygon centroids, and hovering turns a state red via CSS.

CCHANDU BHARGAVI
95% match
Loading thumbnail…

Fork of ICE 8

This fork of ICE 8 shows a choropleth map of the 50 U.S. states, with each state filled in green and its borders drawn in white. The map uses the `geoAlbersUsaTerritories` projection and `d3.geoPath` to render geographic features, sourced from the `us-atlas` TopoJSON dataset, converted via `topojson.feature` and `topojson.mesh`. Hovering over a state turns it orange, implemented with a CSS `:hover` rule in the React and D3 v5 codebase.

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

Fork of ICE 8 - Country Map

This example renders a choropleth-style map of the United States, showing state boundaries as green polygons on a light blue background. It uses d3.geoPath with a d3.geoAlbersUsa projection to draw the map, and topojson-client’s topojson.feature to extract state geometries from the us-atlas states-10m dataset. The SVG output is positioned with margins and styled entirely via embedded D3 attributes, with no interactive or hover behavior.

GGalineeharika
92% match
Loading thumbnail…

Fork of ICE 8 - Country Map

This fork of ICE 8 displays a map of the United States using SVG, with each state filled in green and outlined in dark gray against a light blue ocean background. The visualization loads US Atlas TopoJSON data via `d3.json` and converts it to GeoJSON features with `topojson.feature`. It projects the map using `d3.geoPath` with the `d3.geoAlbersUsa` projection, which centers the contiguous states while placing Alaska and Hawaii in insets. The code is built with D3 v4 and React.

Yyasmeenha
92% match
Loading thumbnail…

Fork of ICE 8 - Country Map

This choropleth map of the United States displays state boundaries as green paths with dark gray strokes on a blue SVG canvas, emulating an ocean backdrop. The visualization uses `d3.json` to load state geometries from the us-atlas states-10m dataset, then projects them with `d3.geoAlbersUsa()` and renders paths via `d3.geoPath()`. Built with D3 v4 and topojson-client, it also uses the React framework for layout.

VVReddy913
91% match
Loading thumbnail…

Fork of ICE8-Country map

This map of the United States displays all 50 states using an orange fill, with black state borders, and highlights individual states in green on hover. It renders geographic data from a TopoJSON us-atlas file using React and D3, applying the `geoAlbersUsaTerritories` projection and `d3.geoPath` to draw the land and interior boundaries. The visualization uses SVG for rendering and loads data asynchronously via a custom React hook with `useState` and `useEffect`.

GGalineeharika
91% match
Loading thumbnail…

Fork of ICE 8 - Country Map

This example displays a map of the United States with individual states rendered as green filled paths on a light blue background. It uses D3 v4 with the `d3.geoPath` and `d3.geoAlbersUsa` projection to convert TopoJSON data from the us-atlas package into SVG paths. The code loads state boundaries from a CDN, applies them via `topojson.feature`, and styles each state with a stroke and fill.

Aamiralitah
91% match
Loading thumbnail…

Fork of Fork of ICE8 USA Map

This example displays a choropleth map of U.S. states, each filled with a distinct categorical color and labeled with its name at the geographic centroid. The visualization uses d3.geoAlbersUsa for projection and d3.geoPath to render state boundaries from TopoJSON data loaded from us-atlas. A d3.scaleOrdinal with schemeCategory10 supplies the fill colors, and hover interactions turn states red via CSS. State names are appended as SVG text elements positioned by d3.geoPath.centroid.

Ssivamani
91% match