Skip to main content
SimilarExport ZIP
100%

Final Project Map

✓ Published0🌍 Public
MMTClass
Last edited May 23, 2017
Created on May 18, 2017

This interactive map visualizes population density across Maryland census tracts and counties, with a draggable circle marker highlighting Rockville. Using D3 v4 and TopoJSON, the code employs a conic conformal projection (`d3.geoConicConformal`) and `d3.geoPath` to render tract boundaries colored via `d3.scaleThreshold` and the `d3.schemeOrRd` color scheme. County outlines are merged from tract geometries, while mouse position is converted to geographic coordinates using `projection.invert`. The map includes a tooltip div and an info readout for cursor location.

AI-generated description

Built with blockbuilder.org

mit Licensed

Similar vizzes

Loading thumbnail…

Final Project Map

This map visualizes population density across Maryland’s census tracts and counties, using a color scale from d3-scale-chromatic to show density values. The map also includes a draggable yellow circle marking Rockville, MD, whose position can be moved via d3.drag. The visualization loads TopoJSON tract boundaries and a separate population JSON, merges tracts into county outlines with topojson.merge, and projects the geometry using d3.geoConicConformal with fitSize. A tooltip shows coordinates on mousemove, while the SVG rendering relies on d3.geoPath and d3.queue.

MMTClass
97% match
Loading thumbnail…

Final Project Map

This choropleth map displays population density for Maryland census tracts, with counties outlined in white and Rockville marked by a yellow circle. Built with D3 v4, it uses `d3.geoConicConformal` projection, `d3.geoPath`, and TopoJSON to render tract boundaries and county merges. A `d3.scaleThreshold` with the `d3.schemeOrRd` color ramp encodes density, while a tooltip shows county names and an interactive circle supports dragging. Population data comes from a JSON file, with tract areas calculated from `ALAND` in square miles.

MMTClass
96% match
Loading thumbnail…

May 11 Maryland

This interactive map of Maryland highlights population density by census tract, with a draggable marker for Rockville and a small pie chart overlay. The map uses a conic conformal projection and color-coded tracts via a threshold scale, transitioning from light to dark oranges. Census tract boundaries are drawn, while county outlines are merged from tract geometries. The visualization is built with D3 v4, TopoJSON, and d3-scale-chromatic, and displays tooltip and pop-up information on demand.

MMTClass
91% match
Loading thumbnail…

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.

MMTClass
91% match
Loading thumbnail…

May 6

A choropleth map of Maryland census tracts colors each area by population density using a red-orange sequential scale, with white county boundary lines overlaid. A yellow draggable circle marks Rockville, and moving it updates a tooltip displaying its current location. Built with D3 v4, it uses `d3.geoConicConformal` projection, `d3.geoPath`, `d3.scaleThreshold`, `d3.schemeOrRd`, and `d3.drag` for interaction. Population and tract data are loaded as JSON files, and the SVG rendering uses a steel-blue background.

MMTClass
90% match
Loading thumbnail…

May 6

A choropleth map of Maryland census tracts colors each area by population density using a red-orange sequential scale, with white county boundary lines overlaid. A yellow draggable circle marks Rockville, and moving it updates a tooltip displaying its current location. Built with D3 v4, it uses `d3.geoConicConformal` projection, `d3.geoPath`, `d3.scaleThreshold`, `d3.schemeOrRd`, and `d3.drag` for interaction. Population and tract data are loaded as JSON files, and the SVG rendering uses a steel-blue background.

MMTClass
90% match
Loading thumbnail…

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`.

MMTClass
90% match
Loading thumbnail…

May 4 in class

This choropleth map of Maryland census tracts displays population density using a threshold scale with the sequential color scheme d3.schemeOrRd, with county boundaries outlined in red. It includes a draggable yellow circle representing Rockville, MD, whose movement is handled by d3.drag, and an HTML tooltip div is appended to the body. The map is rendered as SVG using d3.geoPath with a conic conformal projection, while population data comes from a separate JSON file joined to TopoJSON tracts. A color legend is built with d3.axisBottom and a power scale.

MMTClass
89% match