Skip to main content
SimilarExport ZIP
100%

States with Stamen employees

✓ Published4🌍 Public
AAlan McConchie
Last edited Jan 20, 2022
Created on Oct 21, 2020

A U.S. map highlights the six states where Stamen employees reside as of January 2022, with those states filled in pink and the rest gray, overlaid with white state borders. Built with D3 v4, it loads TopoJSON US state boundaries via `d3.json` and renders them as SVG paths using `d3.geoPath`. The `topojson.feature` API extracts state geometries, and a simple `.classed` check applies the highlight color based on state IDs, with the entire map scaled and shifted by an SVG transform.

AI-generated description

States with Stamen employees as of January 2022

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of States with Stamen employees

This fork of a U.S. states map highlights, in pink, the states where Stamen employees live as of January 2022. Using D3 v4 and TopoJSON, the map loads US state boundaries from a remote dataset and renders them as SVG paths via `d3.geoPath`. A simple CSS class toggles the fill color based on state IDs, while white borders outline all states. The entire SVG is scaled and translated with an SVG `transform` attribute for layout.

SSistema Frenos
89% match
Loading thumbnail…

US State Map

This example displays a static map of US states, with each state rendered as a gray path using an SVG. The code loads state boundary data from a TopoJSON file and converts it into GeoJSON features using the `feature` function from topojson. It then projects the geographic coordinates to screen space with the `geoAlbersUsa` projection and `geoPath` generator from D3, appending the resulting paths to the SVG. No additional data or interactivity is applied.

Ddanrhymes
73% match
Loading thumbnail…

US State Map

This example displays a choropleth-style map of the United States, showing state boundaries as gray filled polygons with white strokes on a blank background. It uses D3 v5’s `geoAlbersUsa` projection and `geoPath` to render the geographic shapes, while the TopoJSON `feature` API extracts state geometries from the `counties-10m.json` dataset hosted via jsdelivr. The map is drawn as SVG paths appended to a fixed 960×500 canvas, with styling applied through a CSS class.

AAkhila-Battula
73% match
Loading thumbnail…

U.S. States TopoJSON

This example shows a map of the United States rendered as SVG paths, where individual states turn red when hovered. The map uses the TopoJSON `us-atlas` file, loaded via `d3.json`, and the code relies on the `topojson` library to convert the TopoJSON topology into geographic features. The rendering is done with `d3.geoPath` to project the geometry, and state borders are drawn as a separate path using a mesh that highlights each boundary. No interaction beyond the hover effect is implemented.

Mmbostock
72% match
Loading thumbnail…

Map

This map displays the United States with each state filled in orange on a blue background. Using the Albers equal-area conic projection, the visualization renders state boundaries from the us-atlas TopoJSON dataset via `d3.geoPath` and `topojson.feature`, with the SVG drawn inside a React application. The map uses a thin gray stroke for state borders and is centered within the viewport through a translate transform.

DDINESH SAI BOPPANA
72% match
Loading thumbnail…

Map

This map displays the 50 states of the USA, using a purple fill for each state with black borders and a hover effect that turns states pink. It renders geographic data with `d3.geoPath` and the `geoAlbersUsaTerritories` projection, processing TopoJSON from the `us-atlas` package. The visualization is built with React and D3 v5, using `useData` to fetch and transform the data, and renders as an SVG via the `Marks` component.

KKusumaKumariDama@my.unt.edu
72% match
Loading thumbnail…

US States Map

This example renders a geographic map of US states using D3 and TopoJSON, loading data from the us-atlas TopoJSON file. It draws each state with `d3.geoPath` and a `geoAlbersUsaTerritories` projection, which includes US territories. State boundaries appear as white strokes overlaid via a TopoJSON mesh, while the map updates reactively through the `d3-rosetta` StateProperty pattern. The visualization highlights the separation between states and provides a clean, basic template for choropleth or interaction extensions.

CCurran Kelleher
72% match
Loading thumbnail…

US State Map

This interactive map of the United States uses D3 v3 to render state boundaries as SVG paths from the included `uStates.js` data file. Each state is colored according to randomly generated sample statistics—low, average, and high values—using an interpolated color scale from light yellow to dark red. Hovering over a state triggers a CSS-based tooltip that displays the state's name and its low, average, and high values in a styled HTML table. The map animates state fills on hover with a subtle opacity change, while the tooltip follows the cursor, providing a clean and informative way to explore the data.

CCoola85
72% match