Two Point Equidistant

100%

Two Point Equidistant

✓ Published0🌍 Public

Last edited Feb 9, 2016

Created on Jan 13, 2013

This example visualizes the Two Point Equidistant projection, which preserves accurate distances from two specified points—here, Honolulu and Washington, D.C. The map displays graticules and landmasses over a stylized background, with a warning that artifacts appear beyond 145° due to incomplete elliptical clipping. It uses `d3.geo.twoPointEquidistant()` with custom scale, translation, and `clipAngle`, along with `d3.geo.path` and `d3.geo.graticule`. Land data comes from a TopoJSON world file, rendered as SVG with styled foreground, graticule, and land paths.

AI-generated description

This is still a work in progress; elliptical clipping is needed to avoid visible artifacts outside of 145° in this example.

gpl-3.0 Licensed

Similar vizzes

Loading thumbnail…

Two Point Equidistant

This example demonstrates the two-point equidistant projection, showing great circles centered on Honolulu and Washington, D.C. as red and blue circles. The map includes world landmasses with the projection applied. The code uses `d3.geo.twoPointEquidistant()` with specified points, `d3.geo.circle()` for generating circles, and `d3.geo.path()` for rendering. It renders to SVG using D3.v3 and topojson, loading world data from a JSON file. The projection is noted as a work in progress with visual artifacts requiring elliptical clipping.

Mmbostock

92% match

Loading thumbnail…

Azimuthal Equidistant

This example demonstrates the azimuthal equidistant projection, a map projection that preserves accurate distances from a central point. The map is centered on San Francisco, with the world rendered using outlines and filled landmasses. The visualization uses D3’s `d3.geoAzimuthalEquidistant` projection and `d3.geoPath` to draw the sphere, graticule, and geographic features. Land and boundary data come from a world-atlas TopoJSON file, processed using the `topojson-client` library. The SVG output includes a graticule, a stroked sphere outline, and a white-filled sphere background.

Mmbostock

76% 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

73% match

Loading thumbnail…

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.

Mmbostock

72% match

Loading thumbnail…

Gringorten Equal-Area

This example demonstrates the Gringorten equal-area projection, a map projection that preserves area while arranging the continents in an unusual, diamond-like layout. The visualization renders world landmasses in dark gray with white country boundaries against a graticule grid, all framed within a sphere outline. The code uses the `d3.geoGringorten` projection from the d3-geo-projection library, combined with `d3.geoPath` for rendering geographic data. World map data is loaded from a 50m resolution GeoJSON file via `d3.json`, and the graticule is generated using `d3.geoGraticule`. The SVG output is styled with CSS for the graticule, land, and boundary features.

Mmbostock

71% match

Loading thumbnail…

Azimuthal Equidistant

This example uses D3 version 3 to create an azimuthal equidistant projection centered on New York City. It draws graticule rings at constant distances from that origin using `d3.geo.circle` and projects them with `d3.geo.azimuthalEquidistant`. The map renders world landmasses and country boundaries from a TopoJSON source, presenting the Earth’s surface as a set of concentric distance rings with a white boundary overlay.

Mmbostock

71% match

Loading thumbnail…

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.

Mmbostock

70% match

Loading thumbnail…

Great Arc

This example visualizes a great arc between Washington, D.C. and Beijing as a red LineString on an equirectangular projection. The projection is rotated to keep the entire arc visible without interruption. It also renders a graticule, land masses, and country boundaries from a TopoJSON world-50m dataset. The code uses d3.geo.equirectangular, d3.geo.path, d3.geo.graticule, and topojson.feature to draw the SVG elements.

Mmbostock

70% match