Shared Data

County Bubbles

A map of the United States uses brown circles sized by county population, with a legend for reference and hover tooltips showing the county name and population. The visualization overlays these bubbles on a gray landmass with white state borders, placing each circle at its county’s centroid. Built with D3 v3, it loads a TopoJSON file containing merged county, state, and nation geometries, projects it via `d3.geo.albersUsa`, and draws the map with `d3.geo.path` while sizing bubbles with `d3.scale.sqrt`. Population data comes from the 2012 American Community Survey.

Mmbostock

Gist 11520211

This example visualizes the geographic boundaries of US states and counties using a TopoJSON file that encodes land, county, and state outlines. Built with D3, it renders the map from the `us.json` TopoJSON data, which contains geometry collections for counties and states. The visualization likely uses D3's projection and path generators to draw the geographic shapes, displaying the boundaries with distinct styling for counties and states. The minimal code structure suggests a basic interactive or static map, with the data provided in a structured TopoJSON format.

CCaged

Population Circles on US Map with D3.js!

This interactive map of the United States visualizes county-level population data as circles. It uses the D3.js library (v5) to render an SVG graphic, employing `d3.geoPath` and a map projection sourced from a TopoJSON file. County centroids are calculated with `d3.geoCentroid` to position each circle. The visualization reads population figures from a local CSV file, and includes a zoom feature via `d3.zoom` for user interaction.

Aacrasto-tibco

US Map with County Centroids using D3.js

A US map displays state boundaries in light green with small red circles marking county centroids, computed via `d3.geoPath` and `d3.geoCentroid` from TopoJSON data. The visualization uses D3 v5 and the `geoAlbersUsa` projection, rendering SVG shapes. County population and COVID-19 case data from a CSV file determines circle sizing, though the visible circles have a fixed radius. Zooming is enabled through `d3.zoom`, and the map is drawn from the us-atlas counties-10m.json dataset.

Aacrasto-tibco

USA geojson

This example displays a choropleth map of the United States using GeoJSON data from a gist, with each state’s population from 2010 encoded by color. It uses d3-geo’s `d3.geoPath` to render the state boundaries and fill them with a color scale based on the `POP2010` property. The map is drawn with SVG, and the layout is generated by projecting the geographic coordinates. The rendering demonstrates how spatial data can be visually encoded using standard D3.js geographic utilities.

JJn1532

US States

This visualization displays a map of the contiguous United States, with each state rendered as a blue SVG path. Hovering over a state turns it red and updates a text overlay near the cursor, showing the state’s name and population from the GeoJSON data. The map uses `d3.geoAlbersUsa()` for projection and `d3.geoPath()` to draw shapes, while mouseover events trigger the text and resize a separate red circle in a second SVG, scaled by population. The data comes from the contiguous-usa.geojson source, and the interaction is built with React and D3 v6.

Ookahne@gmail.com

usapopulation_map

This choropleth map of the United States visualizes estimated 2020 state populations in millions, using a blue sequential color scale to encode values. Built with D3 v7 and the TopoJSON library, it projects state boundaries with an Albers USA projection through `d3.geoPath`. The map reads population data from a hardcoded JavaScript object and renders an interactive SVG where hovering over a state displays its name and population in a tooltip.

CCharith Kapuluru

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