Skip to main content
SimilarExport ZIP
100%

ICE_8 Q1 - US Map (Pdeep)

✓ Published0🌍 Public
PPbarring
Last edited Apr 2, 2022
Created on Apr 2, 2022

This example displays a choropleth-style map of the United States built with D3 v5 and TopoJSON. It renders the 50 states as light green SVG paths with thin black outlines over a sky-blue sphere background. The visualization uses `d3.geoAlbers` for the projection and `d3.geoPath` to generate the shapes. State boundaries come from the `us-atlas` TopoJSON file, with state features extracted via the TopoJSON `feature` API. No interaction or additional styling is applied beyond the static colored map.

AI-generated description
MIT Licensed

Similar vizzes

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

ICE - 8

This example shows a choropleth-style map of the United States, with each state filled in a uniform green color and separated by white borders. It uses the Albers USA projection via `d3.geoAlbersUsa()` and renders the map as an SVG path using `d3.geoPath`. State boundaries are loaded from the TopoJSON `us-atlas` dataset and converted to GeoJSON features with `topojson.feature`. A single `path` element draws the entire collection of states.

Mmendemrudula@gmail.com
90% match
Loading thumbnail…

ICE 8 Q 1.2

A choropleth-style map of the United States renders state boundaries and nation outlines in SVG, using an Albers equal-area projection via `d3.geoAlbers` and `d3.geoPath`. The visualization fetches TopoJSON data from the US Atlas, converts it with `feature` and `mesh` from topojson, and applies a teal land fill with contrasting interior borders. Styling includes a light sphere background and a graticule path, though the graticule is not explicitly rendered in the current code. React manages the component state and data loading through a custom `useData` hook.

117761A04F1
90% 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
90% match
Loading thumbnail…

ICE_8 US_Map

This example displays a choropleth-style map of the United States, with state boundaries highlighted in red against a black landmass and an aqua ocean background. It uses D3’s `geoAlbers` projection and `geoPath` to render the map, while `geoGraticule` draws grid lines. Data comes from TopoJSON in the US Atlas, loaded via `d3.json` and processed with `topojson.feature` and `topojson.mesh`. The visualization is built with React, rendering SVG elements through a `Marks` component.

SShivaKarpe
89% match
Loading thumbnail…

ICE-8 country map

This example displays a choropleth-style map of US states rendered as an SVG using React and D3 v5. The map shows state boundaries with sky-blue land fills and green interior borders, built from a TopoJSON file fetched via `d3.json`. The code uses `geoAlbersUsaTerritories` for projection and `d3.geoPath` to generate paths, while `topojson.feature` and `topojson.mesh` extract land and interior outlines from the dataset.

Ssumitradevipolina
89% match