MD Counties Map

MD Counties

A choropleth map of Maryland counties colors each county by population density using a threshold scale and the d3.schemeOrRd color scheme, with county boundaries derived from a TopoJSON file. Hovering over a county highlights it with a thicker stroke, displays its name, population, land area, and density in an info box, and renders a small pie chart using d3.pie and d3.arc showing the county's population, land area, and density. The map uses a d3.geoConicConformal projection, along with topojson-client to parse geographic data and d3-scale-chromatic for colors.

md-geometry

This visualization shows population density across Maryland census tracts using a choropleth map. The color scale maps density values to an orange-red sequential palette, with darker shades indicating higher population per square mile. Built with D3 v4, it loads TopoJSON tract boundaries and CSV population data, joins them by county and tract FIPS codes, and calculates density by dividing population by land area in square miles. The `d3.geoConicConformal` projection fits the state geometry using `projection.fitSize`, and `d3.geoPath` renders the SVG paths with `d3.scaleThreshold` for coloring.

MD Counties Map_Step 1

This choropleth map displays population density for census tracts in Montgomery County, Maryland, using a threshold color scale from light to dark red. It renders SVG paths via `d3.geoPath` with a conic conformal projection, merging TopoJSON tract boundaries from a local dataset. The code loads tract geometries and population data with `d3.queue`, calculates density by dividing population by land area, and applies `d3.scaleThreshold` with `d3.schemeOrRd`. A legend built with `d3.axisBottom` and a power scale explains the color ranges.

MD Counties with US Atlas

This choropleth map of Maryland counties visualizes population density using a conic conformal projection fitted to GeoJSON county boundaries. The code loads topojson and population data, calculates density as population divided by land area, and fills each county with colors from the d3.schemeOrRd sequential color scheme via d3.scaleThreshold. Hover interactions highlight counties in red. A legend built with d3.axisBottom and d3.scalePow shows the density thresholds. The visualization uses d3.v4, topojson.v2, and renders SVG paths with d3.geoPath, sourced from UMBC VIS class data.

Make a map with MD Counties

This map of Maryland shows census tracts colored by population density using a threshold scale and the d3.schemeOrRd color scheme, with the boundary of Allegany County outlined. A draggable yellow circle, positioned initially at Rockville, displays a tooltip naming the tract under the cursor. Built with D3 v4, it uses d3.geoConicConformal projection, d3.geoPath for rendering, and d3.drag for interaction, loading TopoJSON tract boundaries and population data from a gist.

90% match

MD Counties 4

An interactive choropleth map of Maryland counties displays population density using a sequential color scale, with hover effects revealing county details. A donut chart in the corner dynamically updates to show population, land area, and density proportions for the selected county. Built with D3 v4, the visualization uses `d3.geoConicConformal` for projection, `d3.geoPath` for rendering shapes, and `d3.pie`/`d3.arc` for the chart. Population data is sourced from JSON files, while county boundaries come from TopoJSON.

89% match

May 5

This visualization displays population density across Maryland census tracts using a choropleth map, with color thresholds from d3.scaleThreshold and d3.schemeOrRd. It renders SVG paths via d3.geoPath with a geoConicConformal projection, loading TopoJSON census tract boundaries and a population dataset through d3.queue. County outlines are drawn from merged geometries. A draggable yellow circle marks Rockville, repositioning via d3.drag, while hovering shows the county name in a tooltip using d3.geoContains to test point-in-polygon.

89% match

Final Project Map

This choropleth map displays population density for Maryland census tracts, with county boundaries overlaid in white. A pie chart in the corner visualizes additional data, while a tooltip shows geographic coordinates as the mouse moves. The visualization uses D3 v4 with `d3.geoConicConformal` projection, `d3.geoPath`, `d3.scaleThreshold` with the `d3.schemeOrRd` color scale, and `d3.pie` for the chart. Data comes from TopoJSON tract geometries, CSV population files, and a FIPS county list loaded via `d3.queue`.