Skip to main content
SimilarExport ZIP
100%

Municipalities of Mexico II

✓ Published0🌍 Public
Mmbostock
Last edited Aug 11, 2017
Created on Aug 11, 2017

This example displays a map of Mexico with two layered vector paths: municipalities rendered with thin strokes and states overlaid with thicker outlines. It uses a TopoJSON file that was preprocessed from INEGI shapefiles using command-line tools and visualizes the data with D3’s `d3.geoMercator` projection and `d3.geoPath`. The map is drawn as SVG, with the paths selected and bound to the TopoJSON features via `topojson.feature` and `d3.json`.

AI-generated description
gpl-3.0 Licensed

Similar vizzes

Loading thumbnail…

Municipalities of Mexico

A map of Mexico displays all municipalities as fine gray lines and state boundaries as thicker outlines, rendered with SVG. The visualization uses `d3.geoPath` to project TopoJSON data containing both municipality and state geometry. The geographic data is sourced from INEGI shapefiles and processed into a quantized TopoJSON format via the command-line preprocessing script.

Mmbostock
89% match
Loading thumbnail…

Mexico

Mexico’s municipalities are displayed as a dark choropleth map, using a conic conformal projection applied client-side. The visualization renders each municipality as an SVG path, with hover highlighting in orange; state and municipality boundaries are drawn as white lines. The code uses D3’s `d3.geo.path`, `d3.geo.conicConformal`, and `topojson` to create the map from the preprocessed `mx.json` TopoJSON file. The underlying data derives from INEGI’s 2010 municipal geographic database, simplified and converted via `ogr2ogr` and the TopoJSON build script.

Mmbostock
87% match
Loading thumbnail…

Mexico

This map of Mexico displays all municipalities as dark gray polygons with white state and municipal boundaries. Hovering highlights a region in orange, and a tooltip shows its name. The visualization uses D3 v3’s `d3.geo.path` with a null projection to render pre-projected TopoJSON data, created from INEGI shapefiles via TopoJSON’s command-line tool. Municipality and state boundaries are drawn from the same TopoJSON mesh.

Mmbostock
84% match
Loading thumbnail…

Mexico map

This example displays a choropleth map of Mexico’s regions, rendered as SVG paths. Using D3’s `geoMercator` projection and `geoPath`, it draws country boundaries and graticules, with each region filled in red and outlined in yellow. The map is built with React, fetching TopoJSON data from a gist, converted via `topojson.feature`. The visualization omits data for missing regions, which are not plotted.

RRevanthReddyG
79% match
Loading thumbnail…

Mexico Map

This example displays an interactive map of Mexico's regions, rendered as SVG paths using the D3.js `geoMercator` projection and `geoPath` function. The map is built with React, loading TopoJSON data from a GitHub gist via the `topojson` library's `feature` function. A graticule overlay uses the `geoGraticule` API, and the regions adopt a gray fill color from the CSS, with hover states that change the stroke to pink.

Ppavan0828
78% match
Loading thumbnail…

Mexican_TopoJSON

This visualization displays a map of Mexico's states using a Mercator projection, with landmasses filled in teal and graticule lines in gray. It loads TopoJSON data from a GitHub gist, processes it through `topojson.feature`, and renders it with `d3.geoPath`. The React-based code uses `d3.geoMercator`, `d3.geoGraticule`, and SVG paths, pulling state boundaries from ArcGIS data refined with Mapshaper.

UUNTAdityaAnanthula
78% match
Loading thumbnail…

Mexico map

A choropleth-style map of Mexico's regions rendered as SVG paths using a Mercator projection, with each state outlined in yellow against a blue graticule grid. The visualization loads geographic data from a TopoJSON file hosted as a GitHub gist, processed with the `topojson.feature` API, while D3's `geoPath` and `geoMercator` handle the projection and path generation. The React component fetches the data asynchronously and displays a loading message until the map is ready, with styled fill and stroke colors applied via CSS classes.

VVAbhiram99
77% match
Loading thumbnail…

Mexico Region Map ( D3 & React & TopoJSON )

This example displays a map of Mexico rendered as a single-color choropleth, with state boundaries outlined and a graticule overlay. The visualization uses a Mercator projection via `d3.geoMercator` with the map centered on the country. The geographic data is loaded from a TopoJSON file fetched with `d3.json` and converted to GeoJSON using `topojson.feature`, with the shapes drawn by `d3.geoPath`. The implementation is built with React, managing the asynchronous data fetching through a custom hook and rendering the SVG marks as React components.

AAndres de la Garza
77% match