Peirce Equatorial

100%

Peirce Equatorial

✓ Published0🌍 Public

Last edited Sep 17, 2016

Created on Sep 17, 2016

This example uses the Peirce quincuncial projection to render a world map in an equatorial aspect, displaying the globe as a square with continents shown as dark shapes and borders highlighted in white. The graticule and sphere outline are drawn in gray, and the map is centered with a 45-degree rotation. It employs d3.geoPath with the d3.geoPierceQuincuncial projection from the d3-geo-projection library, and fetches world-50m.json data from a gist to generate landmasses and country boundaries.

AI-generated description

The equatorial aspect of the Peirce quincuncial projection, which is available in d3-geo-projection. By setting the clip angle to 90°, you can produce the Adams hemisphere-in-a-square projection.

forked from <a href='http://bl.ocks.org/mbostock/'>mbostock</a>'s block: <a href='http://bl.ocks.org/mbostock/1ab623030a9d563271f55c5c55dbaf77'>Peirce Equatorial</a> — I removed one rotation.

gpl-3.0 Licensed

Similar vizzes

Loading thumbnail…

Peirce Equatorial

This example shows the world’s landmasses and country boundaries projected onto a square using the Peirce quincuncial projection, which divides the sphere into a square with a distinctive diamond-like layout. The map is rendered as an SVG using D3 v4 and the `d3.geoPierceQuincuncial` projection from the d3-geo-projection library, with a graticule and a sphere outline drawn via `d3.geoPath` and `d3.geoGraticule`. It loads world-50m GeoJSON data from a gist and uses TopoJSON to extract land features and country meshes for the boundaries.

Mmbostock

92% match

Loading thumbnail…

Peirce Quincuncial

This example shows the Peirce quincuncial projection, a conformal map that projects the globe onto a square using a complex algorithm. The visualization displays world landmasses in dark gray with white country boundaries, overlaid on a graticule of meridians and parallels, all within a 960-pixel SVG. The code uses `d3.geoPierceQuincuncial()` from the d3-geo-projection library to define the projection, and `d3.geoPath()` to render the projected geometry. It loads world data from a TopoJSON file, specifically via `topojson.feature` for land and `topojson.mesh` for country boundaries. The sphere is outlined in black, and the rendering is handled with SVG paths.

Mmbostock

90% match

Loading thumbnail…

Flat-Polar Quartic

This example displays a world map projected using the flat-polar quartic projection, which flattens the poles into curved, diamond-like shapes. The map shows landmasses in dark gray with country boundaries in white, overlaid on a graticule grid and enclosed by a circular sphere outline. It uses D3 v3 with the `d3.geo.mtFlatPolarQuartic` projection, `d3.geo.path` for rendering SVG paths, and TopoJSON to load world-50m geographic data. A graticule layer is generated via `d3.geo.graticule`, and the sphere outline is reused as both stroke and fill.

Mmbostock

78% match

Loading thumbnail…

Pierce Tiles

A tiled world map presents the Peirce quincuncial projection, seamlessly repeating across a square grid so that continents weave through the seams. The visualization uses a static rendered image of the projection, loaded as a CSS background with an infinite animation that slowly translates the tiles diagonally, creating an optical illusion of continuous motion. The map itself is computed from geographic data using D3’s `d3.geoPeirceQuincuncial` and `d3.geoPath`, with the resulting PNG file reused as the page’s backdrop.

Mmbostock

78% match

Loading thumbnail…

Equirectangular (Plate Carrée)

This example demonstrates the equirectangular (Plate Carrée) projection, a simple geographic mapping where latitude and longitude are plotted linearly on a flat grid. The visualization displays world landmasses in dark gray and country boundaries in white, overlaid with a graticule grid at half opacity. The code uses d3.geoEquirectangular to define the projection, d3.geoPath for rendering, and topojson to parse world-50m.json data. The map is drawn as SVG paths with styling for land, boundaries, and graticule layers.

Mmbostock

77% match

Loading thumbnail…

Tetrahedric Gnomonic Projection

This example visualizes the world using a tetrahedric gnomonic projection, a polyhedral map projection that unfolds the globe onto four triangular faces. The map renders landmasses and graticules on a Canvas via `d3.geoPath`, with the projection implemented through a custom `d3.geoTetrahedralLee` function that uses `d3.geoPolyhedral` and per-face gnomonic projections. The code includes a dashed inner triangle and outlined sphere boundary, and loads world data from the World Atlas TopoJSON dataset. It also spins the projection interactively using D3's rotation APIs and renders at devicePixelRatio for sharp output.

PPhilippe Rivière

77% match

Loading thumbnail…

Spherical Mercator

The example shows the spherical Mercator projection applied to a world map, displayed within a circular outline that represents the globe. The map renders landmasses in dark gray with white country boundaries, overlaying a graticule grid of meridians and parallels. Built with d3.geoMercator and d3.geoPath, it draws the sphere outline, graticule, and world geography via SVG paths. Geographic data comes from the world-atlas TopoJSON dataset, processed with topojson-client to extract land and country meshes.

Mmbostock

77% match

Loading thumbnail…

Equidistant Conic Projection

This example shows a world map drawn with the equidistant conic projection, including a graticule, landmasses, and country boundaries. The map is rendered as SVG using D3’s `d3.geo.conicEquidistant` projection and `d3.geo.path` to generate the paths. A sphere outline and graticule are drawn first, then geographic data from a TopoJSON file (`world-50m.json`) is loaded with `topojson.feature` and `topojson.mesh` to display land and political borders.

Mmbostock

76% match