Geo Map V1

100%

✓ Published0🌍 Public

Last edited Jan 17, 2023

Created on Jan 17, 2023

This choropleth map of the United States visualizes the percentage of adults over 25 with a bachelor’s degree, using education data from freeCodeCamp. County boundaries are rendered as SVG paths via `d3.geoPath()`, with TopoJSON county data converted to GeoJSON using the `topojson.feature` API. The map is built in React, though the logic operates through D3 v5’s `d3.json()` for asynchronous data loading and selection-based rendering. A descriptive title and subtitle accompany the visualization, which is styled with a CSS-driven layout.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

Similar vizzes

Loading thumbnail…

USA Education Choropleth Map (fcc project)

This choropleth map shows the percentage of adults with a bachelor’s degree or higher across U.S. counties, using a sequential YlGn color scale. The React app loads county, state, and nation boundaries from a TopoJSON file and education data from freeCodeCamp’s CDN, then renders them as SVG paths via `d3.geoPath`. County colors are assigned by looking up each county’s FIPS code in a Map, with white fill for missing data. State outlines are drawn as a mesh overlay, and the map is generated with `d3.json`, `topojson.feature`, and `scaleSequential`.

Ttomahawk-jupiter

87% match

Loading thumbnail…

usa map

This choropleth map shows the percentage of adults aged 25 and older with a bachelor's degree or higher across U.S. counties, using a sequential purple color scale. The visualization is built with React and D3 v5, projecting county boundaries via `d3.geoPath` from a TopoJSON file. County data is loaded from the U.S. Education Data JSON, with counties missing data rendered in gray. Hovering over a county triggers a tooltip displaying the county name and its percentage. A legend uses `d3.scaleThreshold` with a linear scale to map the color ranges.

Rrajamrit-singh

86% match

Loading thumbnail…

test

This choropleth map shades US counties according to the percentage of residents with a bachelor's degree or higher, using an orange-yellow sequential color scale. The visualization leverages React for the SVG rendering, with D3's `geoPath` for drawing county, state, and nation boundaries from a TopoJSON source. Education data is fetched from a freeCodeCamp-hosted JSON file, and county colors are mapped via D3's `scaleSequential` and `interpolateYlOrRd`.

Ttomahawk-jupiter

86% match

Loading thumbnail…

Map of USA

This interactive choropleth map displays the percentage of adults age 25 and older with a bachelor's degree or higher across US counties, using data from the USDA Economic Research Service and TopoJSON map data from the US Census Bureau. County polygons are colored on a yellow-green sequential scale via `d3.scaleSequential` and `interpolateYlGn`, with `d3.geoPath` handling the SVG rendering. Hovering over a county reveals a tooltip showing the county name, state, and exact percentage. The visualization also includes a gradient legend built with D3 scales and React components for the header and tooltip.

NNita

85% match

Loading thumbnail…

Fork of United States Educational Attainment - Choropleth Map

This choropleth map displays the percentage of adults aged 25 and older with a bachelor's degree or higher across U.S. counties, using a purple sequential color scale and gray for missing data. Built with React and D3 v5, it renders county boundaries via `geoPath` and TopoJSON, with a threshold scale mapping education values to colors. Hovering reveals a tooltip showing the county name, state, and percentage. A legend below the map uses `scaleThreshold` and `invertExtent` to display color breaks, while data comes from FreeCodeCamp's education and county JSON files.

DDonald Bagwell

85% match

Loading thumbnail…

Fork of Assignment 9: Choropleth Map

This choropleth map displays the percentage of adults with a bachelor’s degree or higher per U.S. county using a blue threshold color scale and a legend with tick marks. The code loads education data from a CSV and U.S. county boundaries from TopoJSON via `d3.json` and `d3.csv`, then renders paths with `d3.geoPath`. It uses `d3.scaleThreshold` and `d3.schemeBlues` for coloring, adds hover tooltips via SVG `<title>` elements, and overlays state boundaries with `topojson.mesh`. The visualization is built with D3 v5 and React, drawing to an SVG canvas.

CChase Hall

84% match

Loading thumbnail…

United States Educational Attainment - Choropleth Map

This choropleth map visualizes the percentage of adults aged 25 and older with a bachelor's degree or higher across U.S. counties, using data from the FreeCodeCamp education dataset. Counties are colored on a purple sequential scale, with gray indicating missing data. Built with React and D3 v5, the visualization uses `d3.geoPath` to render county boundaries from TopoJSON and `d3.scaleThreshold` to map education percentages to colors. A custom tooltip, implemented via global D3 selectors, displays county name, state, and value on hover, while a legend shows the threshold color scale.

MMohammed Banani | MbDev

84% match

Loading thumbnail…

A9 - Choropleth Map

This choropleth map displays the percentage of adults age 25 and older with a bachelor’s degree or higher across U.S. counties, using data from the FreeCodeCamp education dataset. Counties are colored with a threshold scale using `d3.schemePurples[8]`, with missing data rendered in gray. The map is built with React and D3 v5, using `d3.geoPath` to project county boundaries from TopoJSON, while a custom legend and hover tooltip show exact percentages. The tooltip positioning and visibility are handled manually through mouse events.

RRiya Mathur

84% match