Skip to main content
SimilarExport ZIP
100%

Fork of usa map

✓ Published0🌍 Public
Rreddysushma994@gmail.com
Last edited Apr 2, 2024
Created on Apr 2, 2024
Forked from usa map

This example displays a map of US counties, colored with a categorical color scale and outlined in red. It renders an SVG using a TopoJSON file from the `us-atlas` package, projecting the features with a `geoAlbersUsa` projection. The code employs d3's `geoPath` to generate the map paths and `scaleOrdinal` for coloring each county by name. Hovering turns a county yellow, and the data source is a remote JSON file loaded via d3's `json` loader.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of map

This visualization displays a map of the United States, with each county filled using a categorical color scale based on its name. It renders these counties as SVG paths generated by `d3.geoPath` with the `geoAlbersUsa` projection, sourcing geographic data from a US Atlas TopoJSON file. The counties are outlined in red with low opacity, and they highlight yellow on hover. The visualization uses D3 v5 and the `topojson` library’s `feature` function to extract the geometries from the `counties-10m.json` dataset.

Rreddysushma994@gmail.com
93% match
Loading thumbnail…

Fork of USA map

This fork of the USA map displays state boundaries as SVG paths colored with a categorical scale. When hovering over a state, its fill color changes to red. Built with D3 v5, it uses `d3.geoAlbersUsa` for projection and `d3.geoPath` for rendering. State geometries come from the TopoJSON `us-atlas` dataset, processed via `topojson.feature`, with styling defined in CSS.

Mmukundakrishna.r@gmail.com
89% match
Loading thumbnail…

Fork of usa map

This map of the United States renders each state as an SVG path, colored by a categorical color scale based on the state name. The visualization uses the D3.js library's `geoPath` and `geoAlbersUsa` projection to convert TopoJSON state boundaries into map geometry. A hover effect turns the state black via CSS. The state boundaries are sourced from a remote JSON file containing US states data.

GGeorge Vaz
89% match
Loading thumbnail…

Fork of 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.

VVenkata Rajashekar Reddy Chinthala
89% 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
89% match
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
87% match
Loading thumbnail…

Fork of Fork of Map

This example shows a choropleth map of U.S. states, with each state filled by a categorical color from `schemeCategory10`. The code loads county-level TopoJSON data from the `us-atlas` CDN and renders the boundaries using `d3.geoPath` with an `geoAlbersUsa` projection. State features are extracted via `topojson.feature`, and each path’s fill is assigned by a `scaleOrdinal` based on the state name, with a tooltip title appended. The visualization demonstrates a straightforward integration of D3’s geospatial and scale APIs.

Rreddysushma994@gmail.com
87% match
Loading thumbnail…

usa map

This example displays a choropleth-style map of US states, with each state filled by a categorical color from `d3.scaleOrdinal` and `schemeCategory10`. It uses `d3.geoPath` with a `geoAlbersUsa` projection to render the SVG paths, and the state boundaries are loaded from a TopoJSON file via `us-atlas`. Hovering a state changes its fill to yellow, while a red stroke outlines all boundaries. The code processes the TopoJSON with `topojson.feature` and appends a `<title>` element for each state name.

SSai Hemanth Babu Sunkari
87% match