// source http://jsbin.com/bobulik

100%

// source http://jsbin.com/bobulik

✓ Published0🌍 Public

Last edited Mar 3, 2017

Created on Mar 3, 2017

This example displays a static Albers equal-area conic projection map of the United Kingdom, with its constituent subunits (England, Scotland, Wales, and Northern Ireland) filled in distinct colors. It renders the geographic boundaries and labels place names from the TopoJSON dataset. Using the d3.geoAlbers projection and d3.geoPath, the SVG paths are generated from the topojson feature collection. The code loads the UK map data via d3.json and applies CSS to hide Ireland.

AI-generated description

Similar vizzes

Loading thumbnail…

Untitled

This visualization displays a choropleth map of the United Kingdom using an Albers projection, with distinct colors for England, Scotland, Wales, and Northern Ireland, while hiding the Republic of Ireland. It renders subunit boundaries with dashed strokes and labels for each region, alongside place points and their labels. The code uses D3.js v3 with `d3.geo.albers`, `d3.geo.path`, and `topojson` to load and project geospatial data from a `uk.json` file, generating an SVG output within a React framework.

Vvenkatajayanth03

84% match

Loading thumbnail…

UK Map

This example displays a single red map of the United Kingdom rendered as an SVG path. The map is projected using the Albers equal-area conic projection, configured with specific center, rotation, parallels, and scale parameters. The visualization uses d3.geoPath to draw the geographic boundaries, with the topojson library to convert the uk.json TopoJSON data into GeoJSON features. The shape is filled entirely red, emphasizing the country’s outline without additional thematic data. The code relies on d3.json to load the dataset and appends the resulting path directly to the SVG.

NNigel

82% match

Loading thumbnail…

United Kingdom - Country Map

This example displays a choropleth map of the United Kingdom using a green fill with black borders. It loads geographic data from the world-atlas TopoJSON file, extracts the United Kingdom feature, and projects it with a Mercator projection using `d3.geoMercator` and `d3.geoPath`. The map is rendered as an SVG path element within a 960×500 canvas, with data fetched via `d3.json`.

LLakshmanRangisetti

80% match

Loading thumbnail…

Albers Equal-Area Conic

The visualization demonstrates the Albers equal-area conic projection, a standard map projection commonly used for the United States. It displays the country’s landmass, county boundaries, and state lines over a graticule grid, with a dark land fill contrasted against white administrative borders. The code uses d3.geo.albers with custom rotation, center, parallels, and scale parameters, and renders geographic features via d3.geo.path. TopoJSON data from a remote source is parsed with topojson.feature and topojson.mesh to draw the land and boundary layers, while d3.geo.graticule generates the grid.

Mmbostock

78% match

Loading thumbnail…

Albers Projection

This example displays a map of the United States using the Albers projection, a conic equal-area projection commonly used for national-scale choropleths. It renders the geographic boundaries as gray SVG paths with white strokes, loaded from a local `states.json` GeoJSON file. The code uses the D3 v3 library, specifically the `d3.geo.albers()` projection and `d3.geo.path()` to project and draw the feature collection.

Mmbostock

77% match

Loading thumbnail…

Albers Projection

This example displays a map of the United States using the Albers projection, with each state drawn as a filled gray polygon with white outlines. The visualization loads GeoJSON data from a remote `us.json` file via `d3.json`, which is then converted into SVG paths using `topojson.feature` and `d3.geo.path()`. The map is rendered as a single SVG path element within a 960×500 canvas, demonstrating a basic static choropleth without additional interactivity or styling layers.

Mmbostock

77% match

Loading thumbnail…

US Map Projection

This example displays a map of the United States using an Albers equal-area conic projection, with the landmass filled in light gray and state boundaries in white. It uses D3.js (d3.v7) with the `d3.geoAlbersUsa()` projection and the `d3.geoPath()` function to render the geographic shapes as SVG paths. The map is drawn within a fixed 960×600 viewport, and the underlying geographic data is handled by the TopoJSON library.

EErik Erickson

76% match

Loading thumbnail…

United Kingdom MAP

This map of the United Kingdom displays geographic boundaries and town locations. It renders NUTS regions from a TopoJSON source using `d3.geoPath` with an equirectangular projection. Town data is fetched from a remote API and plotted as circles, with `title` tooltips showing county, population, town name, and coordinates. The visualization uses D3 v7 for SVG drawing and the `topojson` library for feature extraction.

22549239

76% match