Gist 798feae1c276739f819a2f2b4784a728

100%

Gist 798feae1c276739f819a2f2b4784a728

✓ Published0🌍 Public

Last edited Apr 27, 2021

Created on Apr 27, 2021

This visualization displays the 50 U.S. states as a choropleth-style map using a GeoJSON file containing state boundaries and attributes. The map renders the contiguous United States with state polygons colored and labeled by state name, sourced from Natural Earth data via a GitHub gist. The visualization uses geographic coordinates (CRS84) to project state shapes, with Alaska and Hawaii positioned separately, allowing viewers to see the full national extent at a glance.

AI-generated description

Similar vizzes

Loading thumbnail…

states.geojson

This example visualizes the boundaries of all U.S. states from a GeoJSON file. The data is rendered as a static map using D3's geographic projections and path generators (e.g., d3.geoPath), with each state's polygon colored distinctly to show its shape and relative location. The visualization relies on the coordinate geometry in states.geojson to draw the contiguous United States, Alaska, and Hawaii, enabling quick comparison of state boundaries and spatial layout.

WWill Carter

84% match

Loading thumbnail…

Gist ac8a3dad7ca4f38ccd1e41d681f304d5

This visualization maps the geographic centroids of U.S. states as points, using a GeoJSON dataset that includes detailed attributes for each state. The map likely uses D3.js to plot the points, with the state names or abbreviations as labels, and the points positioned at the centroid coordinates. The visualization is a simple, static representation of state locations, useful for geographic reference or as a base layer for further data encoding.

AAlan McConchie

83% match

Loading thumbnail…

Gist c74a36a544e6649522366453f5e1d6fa

A choropleth-style map of the United States renders state boundaries as black outlines on a white background, using an Albers USA projection centered within a 700x580 SVG. The visualization loads geographic features from a local `us-states.json` file and draws each state path via D3 v4’s `d3.geoPath` with a `d3.geoAlbersUsa` projection. No data values or color encoding are applied, leaving the map purely as a geometric outline of the country’s administrative divisions.

EEssohanamKouyou

83% match

Loading thumbnail…

Gist c5464c81f3437808eb7f9c296e71b51a

This visualization displays the administrative boundaries of US states and Canadian provinces from a GeoJSON dataset. Using D3.js, the map renders the geographic polygons as an interactive choropleth, with each state or province colored distinctly. The visualization leverages the GeoJSON FeatureCollection to draw boundaries, highlighting the administrative regions of North America.

AAlan McConchie

83% match

Loading thumbnail…

Gist 6b64443aba2850cb55742070acbbd681

A choropleth-style map of U.S. states rendered with D3 v4, using the `d3.geoAlbersUsa` projection and `d3.geoPath` to draw each state's boundaries from the included `us-states.json` GeoJSON data. The SVG canvas is fixed at 700 by 580 pixels. No additional styling or interactivity is applied; the visualization simply displays the unadorned state outlines.

RRemiFaure

82% match

Loading thumbnail…

Gist c7527476915607ec97df5ec292a38e8f

This example displays a static map of the United States using the Albers equal-area conic projection. The visualization renders all state boundaries as individual SVG paths, with Alaska and Hawaii included as multi-part polygons. The code loads geographic data from a local `us-states.json` file and uses the `d3.geo.albersUsa()` projection and `d3.geo.path()` API to convert GeoJSON coordinates into scalable vector graphics. Built with D3 version 3, the map fills the entire browser viewport.

RRomyRatolojanahary

80% match

Loading thumbnail…

Gist ea51c362645dc8fb9bdbba440558b37a

Atlas of the United States, using a TopoJSON shapefile rendered with `d3.geoPath` and a custom Albers projection. The map is overlaid with a graticule generated by `d3.geoGraticule`, and states are colored by a choropleth scale. The visualization is drawn on an SVG canvas, and the code uses `d3.json` to load the TopoJSON data and `topojson.feature` to convert it into GeoJSON. A tooltip appears on hover, displaying the state name and value.

CCliffordAnderson

80% match

Loading thumbnail…

Gist 4f0c8fb5332c2deba6c05cc673c84000

This visualization displays the geographic boundaries of US states, rendered as SVG paths from a local `us-states.json` GeoJSON file. It uses `d3.geo.albersUsa()` to set an Albers equal-area conic projection, `d3.geo.path()` to generate the path data for each state feature, and appends the resulting paths to a fixed 700x580 SVG canvas. The code loads the data via `d3.json()` and iterates over the GeoJSON features to draw each state shape, though it only maps the coordinates without additional styling or interactivity.

SSamyMe

79% match