Skip to main content
SimilarExport ZIP
100%

Winkel Tripel Graticule

✓ Published0🌍 Public
Mmbostock
Last edited Feb 9, 2016
Created on Sep 7, 2012

This example displays a global graticule—a mesh of latitude and longitude lines—projected using the Winkel Tripel projection, with a thicker outline emphasizing the map’s outer boundary. The visualization uses D3 v3’s `d3.geo.winkel3()` projection, `d3.geo.path()` to render the projected geometry, and `d3.geo.graticule()` to generate the grid. The graticule lines and outline are drawn as SVG paths, with the projection scaled and centered to fit a 960×500 canvas.

AI-generated description
gpl-3.0 Licensed

Similar vizzes

Loading thumbnail…

Winkel Tripel

A world map in the Winkel Tripel projection shows land masses in black with white boundaries, enclosed by a graticule and a spherical outline. The map displays all continents without extreme distortion, using a custom geographic projection. Built with the D3 v3 library, the example loads world-50m.json data and renders SVG paths via d3.geo.path with the d3.geo.winkel3 projection, applying graticule and boundary meshes through topojson.

Mmbostock
88% match
Loading thumbnail…

Rotating Winkel Tripel

A rotating Winkel Tripel projection continuously spins the world map around its longitude axis. The example shows both landmasses and graticule lines drawn on a canvas, with the rotation driven by a timer that updates the projection’s rotation each frame. It uses D3 v3 with the `d3.geo.winkel3` projection, `d3.geo.path`, and Canvas 2D context, while loading world-110m TopoJSON data. The graticule and its outline are stroked separately to distinguish the grid from the map frame.

Mmbostock
84% match
Loading thumbnail…

Aitoff Graticule

This visualization displays a global graticule—the network of latitude and longitude lines—projected using the Aitoff map projection. The black graticule lines are drawn as SVG paths, with a thicker outline marking the projection’s outer boundary. The code uses the D3.js v3 library, specifically `d3.geo.aitoff()`, `d3.geo.path()`, and `d3.geo.graticule()`, to generate the geographic coordinates and render them as vector graphics.

Mmbostock
79% match
Loading thumbnail…

Eckert III

This example demonstrates the Eckert III map projection, a pseudocylindrical projection that preserves equal area. The SVG canvas displays a graticule and world map, with landmasses rendered in dark gray and country boundaries in white. Using the D3 v3 library, the code employs `d3.geo.eckert3()` for the projection, `d3.geo.path()` to draw geographic paths, and `d3.geo.graticule()` to generate the grid. The world map data is loaded from a remote GeoJSON file via `d3.json()` and transformed using the TopoJSON library.

Mmbostock
77% match
Loading thumbnail…

Transverse Mercator

This example demonstrates the transverse Mercator map projection, displaying world landmasses and country boundaries within a graticule grid. The map is rendered as SVG using the D3.js library, specifically employing the `d3.geoTransverseMercator` projection and `d3.geoPath` for drawing geometries. World data comes from the `world-atlas` package, processed with `topojson-client` to extract land and boundary features. The visualization includes a spherical outline, a graticule, and styled land and boundary paths, all centered within a 960x960 canvas.

Mmbostock
76% match
Loading thumbnail…

Wiechel

This example visualizes the world on a Wiechel projection, a pseudo-azimuthal map that appears as a heart-shaped sphere. It displays continents in dark fill and country boundaries in white, overlaid with a graticule grid, all within a circular outline. The code uses the `d3.geo.wiechel` projection, `d3.geo.path`, and `d3.geo.graticule` from the d3.geo.projection library to render the map as SVG. World map data is loaded from a 50m GeoJSON file via `d3.json` and processed with `topojson`.

Mmbostock
76% 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
75% match
Loading thumbnail…

Gnomonic

This example shows the world map projected using the gnomonic projection, where great circles appear as straight lines and distortion increases toward the edges. The map is clipped at a 90-degree angle, displaying landmasses in dark gray with white country boundaries over a graticule grid. The visualization uses D3 v3’s `d3.geo.gnomonic` projection and `d3.geo.path` to render SVG paths from TopoJSON world data, with the graticule drawn via `d3.geo.graticule`. The code sets projection scale, translation, and precision before loading the `world-50m.json` file.

Mmbostock
75% match