Untitled

Massachusetts Chrolopleth map with interactive legend

This choropleth map shows Massachusetts town boundaries colored by county, with an interactive legend that highlights matching regions on hover. The visualization uses React with d3.v5, including `d3.geoAlbers` for projection and `d3.geoPath` for rendering SVG paths from TopoJSON data. A CSV file maps towns to counties, and the legend employs `d3.scaleOrdinal` with a custom `ColorLegend` component. Hovering a legend value dims non-matching towns via reduced opacity while brightening the selected county.

73% match

Massachusetts Chrolopleth map with interactive legend and viewbox

This choropleth map displays Massachusetts town boundaries colored by county, with an interactive legend that highlights matching regions on hover. The visualization uses React with D3 v5 APIs including `geoAlbers`, `geoPath`, and `scaleOrdinal` to project and render the TopoJSON geometries. A viewBox crops the map to the state, while legend hover states adjust fill opacity for focused counties. Town-to-county mappings come from a CSV gist, and geographic data originates from MassGIS shapefiles converted through ogr2ogr and mapshaper.

73% match

Cheap map

This example displays a geographic map of Massachusetts towns, colored light green with black borders, that turns red on hover. The visualization is built using D3 version 5 and renders as an SVG element. It loads GeoJSON data from a remote GitHub gist containing town boundaries and projects it using D3’s map projections, specifically `geoConicConformal` and `geoAlbersUsa`. The code defines SVG classes for styling the map’s countries and a hover effect, though the actual rendering of the map geometry is not yet implemented in the provided JavaScript snippet.

NNilla

73% match

Massachusetts Towns

This example visualizes the towns of Massachusetts as a choropleth-style map using SVG. It loads GeoJSON town boundaries from a remote gist and renders them as filled paths with black strokes via `d3.geoPath`, projected using `d3.geoConicConformal` with parameters fit to the state. The map is drawn into a dynamically created SVG element sized 800×400, with the projection fitted to the data extent. D3 v5 and TopoJSON are used for data loading and path generation, though the code appears incomplete as only the town polygons are shown without additional styling or interactivity.

NNilla

Massachusetts Chrolopleth map with interactive legend

This interactive choropleth map of Massachusetts displays county boundaries, with each town colored according to its county. A legend on the right uses an ordinal color scale and responds to mouse hover, dimming non-matching map regions and highlighting the selected county. Built with React and D3 v5, it uses `d3.geoAlbers` and `d3.geoPath` to project and render TopoJSON features converted from Massachusetts town boundary shapefiles via mapshaper. County assignments come from a CSV mapping file, and the legend uses `d3.scaleOrdinal` for color encoding.

Massachusetts Chrolopleth map with interactive legend

A choropleth map of Massachusetts displays town boundaries colored by county, with an interactive legend that highlights towns in the selected county on mouse hover. Built with React and D3 v5, it uses `d3.geoAlbers` projection with custom rotation and scale via `d3.geoPath` for rendering SVG paths. The legend, implemented with HTML circles and text, updates a hovered value state to filter which towns receive the highlight. Town-county mappings come from a CSV, with geoJSON spatial data from a gist.

Massachussets

This example visualizes Massachusetts school districts as a choropleth map, with each town randomly assigned one of three colors from a categorical scale. The geographic boundaries are rendered using a conic conformal projection through `d3.geoPath`, while React manages the component structure. Data is loaded from a local TopoJSON file containing town boundaries, and the color mapping is applied via `d3.scaleLinear`. The map is displayed as SVG paths with black strokes highlighting district borders.

11993-INDALKAR