Fork of Fork of US states map : with colorScale. One color for each country

100%

Fork of Fork of US states map : with colorScale. One color for each country

✓ Published0🌍 Public

Last edited Apr 3, 2022

Created on Apr 3, 2022

Forked from Fork of US states map : with colorScale. One color for each country

This choropleth map of U.S. counties assigns a distinct categorical color to each state using `d3.scaleOrdinal` with `d3.schemeCategory10`. The map projects geographic data with `d3.geoPath` and a `d3.geoAlbersUsa` projection, rendering counties as SVG paths with red strokes and a blue hover effect. It loads TopoJSON county boundaries from the `us-atlas` package and includes a tooltip with each county’s state name via appended `title` elements. The visualization uses `d3.v5` and the `topojson` library for feature extraction.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of US states map : with colorScale. One color for each country

This choropleth map displays US states, each filled with a distinct color from a categorical palette. The visualization uses the D3.js library, specifically `d3.geoPath` with `geoAlbersUsa` projection, to render the map from a TopoJSON file loaded from the us-atlas package. The color scale assigns colors based on the state's name, and hovering over a state turns it green via CSS. The map also includes tooltips that reveal the state name using the `.append('title')` method.

DDonald Bagwell

92% match

Loading thumbnail…

Fork of US states map : with colorScale. One color for each country

This example displays a map of US states, with each state filled by a unique color from a categorical scale and its name in a tooltip on hover. It uses a TopoJSON file from the us-atlas package, projected with `geoAlbersUsa()`, and rendered via `d3.geoPath` into SVG paths. The view also uses `d3.scaleOrdinal` with `schemeCategory10` for the color mapping.

JJyothicherukuri

91% match

Loading thumbnail…

Fork of US states map : with colorScale. One color for each country

This visualization displays a choropleth map of US states, where each state is filled with a distinct color from a categorical palette. The map uses the d3.geoAlbersUsa projection to render the geographic boundaries as SVG paths. Data is loaded from the us-atlas counties-10m.json file, with state names mapped to colors via d3.scaleOrdinal. States turn blue on hover, using CSS styling within the d3.select, d3.geoPath, and d3.json workflow.

Nnagamaheswar

91% match

Loading thumbnail…

Fork of US states map : with colorScale. One color for each country

A choropleth map of US states renders each state as a muted gray SVG path with thin dark borders, using an Albers USA projection. The visualization currently shows uncolored states, though the code defines a color scale with `d3.scaleOrdinal` and `schemeCategory10` for per-state coloring. Hovering any state turns it green via CSS. The map is built with `d3.geoPath`, TopoJSON state features, and the `geo-albers-usa-territories` projection, loading geographic data from the `us-atlas` package.

SSnapika

91% match

Loading thumbnail…

Fork of US states map

This example displays a choropleth map of US states, with each state filled by a categorical color assigned through `d3.scaleOrdinal` and `schemeCategory10`. It renders the map using `d3.geoPath` with a `geoAlbersUsa` projection, drawing state boundaries from TopoJSON county data loaded via `d3.json`. Hovering over a state turns it green through CSS, and each state includes an SVG `<title>` element showing its name.

SShawn-Lian

89% match

Loading thumbnail…

Fork of Fork of US states map : with colorScale. One color for each country

This example displays a choropleth-style map of African states, rendered as green SVG paths with white strokes on a dark background. It loads GeoJSON data from a GitHub gist, converts it into geographic features using `topojson.feature`, and projects the shapes with `d3.geoAlbersUsa` and `d3.geoPath`. Each state path includes a `<title>` element showing the region’s name from the data’s properties. The implementation relies on D3 v5 for selection, data loading, and path generation, while the map’s styling is defined in an external stylesheet.

Bbhargavarathod

88% match

Loading thumbnail…

US states map : with colorScale. One color for each country

This example displays a choropleth map of US states, with each state assigned a distinct color from the d3.scaleOrdinal and schemeCategory10 palette. Hovering over a state turns it green, providing interactive feedback. The map is rendered as SVG paths using d3.geoPath with a geoAlbersUsa projection, processing TopoJSON county data from the us-atlas dataset. State names are included as tooltips via appended title elements.

Aanduskong

86% match

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

85% match