melting-antarctica

Rotating Transverse Mercator

A rotating transverse Mercator projection continuously spins a world map around its central meridian, showing how the projection distorts shapes and areas away from the axis of rotation. The animation uses a dark canvas with white country borders and a semi-transparent graticule, all rendered via `d3.geoPath` and Canvas 2D drawing. Land polygons and country boundaries come from TopoJSON data in the world-atlas package, while a `d3.timer` updates the projection’s rotation each frame. The code specifies `d3.geoTransverseMercator`, `d3.geoGraticule10`, and `topojson.feature` and `topojson.mesh` for data processing.

73% match

Tetrahedral Gnomonic projection Antarctic

This example visualizes the world map using the Tetrahedral Gnomonic projection, an Antarctic-centered aspect of Potter’s 1925 map projection. The globe is split across four triangular faces, each rendered with a gnomonic projection via `d3.geoPolyhedral` and `d3.geoGnomonic`. Landmasses are drawn on a Canvas with `d3.geoPath`, overlaid with graticules, and the map is interactive, allowing rotation through drag gestures using the `versor` library. Map data comes from TopoJSON world-atlas countries.

PPhilippe Rivière

73% match

Antimeridian Cutting II

This interactive visualization demonstrates antimeridian cutting with an interrupted Homolosine projection, allowing a user to rotate the globe by moving the mouse or touching the canvas. It renders land polygons from the World 110m TopoJSON dataset onto a Canvas element using d3.geoInterruptedHomolosine and d3.geoPath, with the projection’s rotation updated via scale functions mapping pixel coordinates to longitude and latitude. A clipping region outlines the sphere, and the land is filled in black over a white background.

73% match

Mollweide Hemispheres

This example displays a world map using the Mollweide projection, interrupted into two hemispheres—northern and southern—which are rotated twenty degrees and centered on a 960-by-500 SVG canvas. The map shows landmasses as dark shapes with white country boundaries, overlaid on a graticule, all clipped to a circular sphere. It uses the `d3.geo.interrupt` and `d3.geo.mollweide.raw` projections with `d3.geo.path`, and renders geographic data from a World 50m TopoJSON dataset, drawing both land polygons and a mesh of country boundaries.

Vanishing Earth

Vanishing Earth shows a rotating world map that gradually shrinks to a single point, then expands back, creating a pulsing effect. An orthographic projection clips the globe’s landmasses from topojson-featured world data, while the clip angle oscillates between 45 and 90 degrees. Rendered on a canvas with device-pixel-ratio scaling, the animation uses d3.timer and d3.geoPath to redraw the land and sphere outlines each frame, with the projection’s rotation and clipAngle updated as time elapses.

PPhilippe Rivière

Floating Landmasses

An orthographic projection of the world appears as a rotating globe, with continents rendered as two concentric spheres to create a floating-landmass effect. Using d3.geo.orthographic and d3.geo.path with canvas, the code layers a blurred, semi-transparent land silhouette behind a crisper foreground, while a graticule grid rotates overhead. The land data comes from a TopoJSON world-110m file, and the animation is driven by d3.timer with changing projection scale and clip angles.

Concentric Circles Emanating

An animated map shows concentric red circles emanating from a glowing dot over the Indian Ocean. A base layer renders graticule lines and world landmasses using `d3.geo.path` with a Mercator projection. The animation repeatedly appends a circle at the projected dot position, then uses `transition()` with linear easing to expand its radius while fading its stroke opacity over six seconds. The repeating action is driven by `setInterval`, while land data comes from a remote TopoJSON file.