Foucaut projections (1862)

August Projection

This example displays a world map using the August projection, a pseudocylindrical equal-area projection that curves parallels and meridians into distinctive intertwined shapes. The map renders land masses in dark gray with white country boundaries overlaid on a graticule, all enclosed within a spherical outline. Using D3 v3, the code employs `d3.geo.august` for the projection, `d3.geo.path` to draw geographic features, and `d3.geo.graticule` for the grid. TopoJSON data provides the world land and country boundaries, loaded from an external JSON file.

73% match

Tobler’s Hyperelliptical projection

This example demonstrates Tobler’s Hyperelliptical projection, a family of pseudocylindrical equal-area map projections with adjustable parameters alpha, gamma, and k. The default configuration renders a world map with a compact, oval-shaped graticule that balances area distortion across the globe. Using d3-geo-projection’s `geoHyperelliptical` projection, the map is drawn as SVG paths via `d3.geoPath`, with land polygons from world-atlas TopoJSON data. Interactive rotation and responsive resizing are enabled through d3-inertia and `fitExtent`.

72% match

Collignon

This example shows the Collignon projection, a pseudocylindrical equal-area map projection, applied to world geography with a graticule and country boundaries. The map displays land masses in dark gray against a white sphere outline, with graticule lines in gray and country borders in white. It uses the D3 v3 plugin’s `d3.geo.collignon` projection and `d3.geo.path` to render SVG paths. Land and country mesh data come from TopoJSON (world-50m.json), with a graticule generated via `d3.geo.graticule`.

72% match

Poor man's Composite projection

Four map projections—Lagrange, azimuthal equal-area, orthographic, and azimuthal equidistant—are arranged in a 2x2 grid to form a single composite projection. The d3.geoPath renderer draws world landmasses from TopoJSON, a graticule, and the sphere outline, with each projection clipped to its quadrant. A custom `projection.invert` method tests each quadrant to locate mouse positions, and the red inverted point follows the cursor. Continuous rotation of all four projections via d3.timer produces an animated display.

72% match

Cylindrical Equal-Area

This example shows a world map rendered using the cylindrical equal-area projection, with dark landmasses and light country boundaries overlaid on a graticule. The projection’s shape is modified by selecting different standard parallels, such as Gall–Peters or Hobo–Dyer, highlighting how the choice affects the map’s proportions. The visualization uses `d3.geoCylindricalEqualArea` and `d3.geoPath` from the `d3-geo-projection` library to draw the paths, while geodata is loaded as TopoJSON from a GitHub-hosted file. The SVG output is styled with CSS classes for the graticule, land, and boundaries.

Flat-Polar Parabolic

A flat-polar parabolic projection maps the world onto an oval-shaped canvas, with landmasses filled in dark gray and country boundaries marked by thin white lines. The visualization also includes a graticule grid and an outer sphere outline, rendered as SVG paths using d3.geo.path and the d3.geo.mtFlatPolarParabolic projection. Geographic data comes from a TopoJSON world file, processed via topojson.feature and topojson.mesh. The projection scale and translation are set explicitly, with precision configured for smooth rendering.

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.

Bottomley projection

This example demonstrates the Bottomley projection, a pseudocylindrical map projection that preserves shapes along the central meridian, with a configurable variant parameter. The code loads world land and country boundary data from a TopoJSON file and renders it via SVG paths created with `d3.geoPath` and the custom `d3.geoBottomley` projection. A graticule and sphere outline are also drawn, and the projection’s variant can be adjusted through the `projection.variant` method, highlighting the projection’s flexibility.