Tissot’s Indicatrix for Bottomley

100%

Tissot’s Indicatrix for Bottomley

✓ Published0🌍 Public

Last edited Jun 25, 2016

Created on Jan 22, 2016

This visualization uses Tissot’s Indicatrix to reveal distortion in the Bottomley projection, displaying orange circles over a graticule and world map. The code builds the indicatrix from small circles of fixed angular radius, placed at grid intersections, then projects them via `d3.geo.bottomley` and renders with `d3.geo.path`. It relies on D3 v3, TopoJSON for land and boundary shapes, and a `d3.geo.circle` generator, while the graticule and sphere outline come from D3’s geo utilities.

AI-generated description

False Tissot's Indicatrix approximated with small circles, based on work by Tom Carden. A true Tissot’s Indicatrix has now been implemented by Jason Davies.

forked from <a href='http://bl.ocks.org/mbostock/'>mbostock</a>'s block: <a href='http://bl.ocks.org/mbostock/5628479'>Tissot’s Indicatrix</a>

Similar vizzes

Loading thumbnail…

Tissot’s Indicatrix

This visualization demonstrates Tissot’s Indicatrix by projecting a grid of small orange circles onto an orthographic globe, showing how map projections distort shapes, areas, and angles. The globe also includes graticules, landmasses, and country boundaries. It uses D3 v3’s `d3.geo.orthographic`, `d3.geo.path`, `d3.geo.circle`, and `d3.geo.graticule` to construct and render the projection. TopoJSON supplies the world geometry, with the land and boundary layers inserted via `topojson.feature` and `topojson.mesh`. The SVG output includes stroked sphere outlines and semi-transparent indicatrices.

Mmbostock

88% match

Loading thumbnail…

Tissot's Indicatrices

An orthographic projection of the world displays Tissot's indicatrices as red circles at 30-degree intervals of latitude and longitude. The visualization uses D3 v3 with `d3.geo.orthographic()` and `d3.geo.path()` to render SVG shapes, including graticule lines, land masses from `readme-land.json`, and boundaries. The circles are generated using `d3.geo.circle()` with a fixed angular radius, demonstrating how the projection distorts shapes across the globe.

RRandomEtc

83% match

Loading thumbnail…

Bottomley

This example displays a world map using the Bottomley projection, a pseudocylindrical equal-area projection with curved parallels. Landmasses are filled in dark gray with white country boundaries, overlaid on a graticule and a black sphere outline. The code uses `d3.geo.bottomley()` from the d3.geo.projection plugin, rendered as SVG via `d3.geo.path()`. World data comes from a TopoJSON file, with countries meshed via `topojson.mesh` and land converted through `topojson.feature`.

Mmbostock

77% match

Loading thumbnail…

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.

PPhilippe Rivière

77% match

Loading thumbnail…

Tobler–Mercator

This example demonstrates the Tobler–Mercator projection, a modified Mercator projection that preserves area. The world map is rendered with graticule lines, country boundaries, and a white sphere outline. Built with D3 v4, it combines `d3.geoProjection` with a custom projection function and `d3.geoPath` for geographic rendering. The map uses TopoJSON data from the world-atlas package, with land and country boundary geometries loaded via `d3.json` and processed using `topojson.feature` and `topojson.mesh`. The visualization is fully SVG-based.

Mmbostock

71% match

Loading thumbnail…

visualizing map distortion d3v4

A side-by-side visualization demonstrates map projection distortion by pairing an interactive Aitoff projection with a fixed orthographic globe. The user can pan and zoom the left map via `d3.zoom`, while the right globe rotates to match the map’s center using `projection.invert` and `projection.rotate`. A grid of red dots, generated as screen coordinates, is overlaid on both views; on the map they appear directly, while on the globe their positions are computed through the inverse projection, revealing how distances and shapes stretch across different projections. The implementation uses `d3.geoPath`, `d3.geoGraticule`, `d3.geoProjection`, and TopoJSON world data, with SVG rendering.

PPhilippe Rivière

70% match

Loading thumbnail…

simplified borders

A rotating orthographic globe displays country boundaries as simplified straight lines, reducing each border arc to a single segment between its first and last points via `topojson.meshes`. Landmasses render as dark fills with white graticules, while borders are colored blue for coastlines and other hues for shared boundaries. The animation uses `d3.timer` to update the projection rotation and `d3.geoPath` to redraw paths, sourcing geometry from a TopoJSON world dataset.

PPhilippe Rivière

70% match

Loading thumbnail…

Littrow

The example displays a world map using the Littrow projection, with landmasses in dark gray and country boundaries in white, clipped to a spherical outline. It also overlays a graticule to show latitude and longitude lines. The visualization uses D3 v3 with the `d3.geo.littrow` projection plugin, `d3.geo.path`, and `d3.geo.graticule` to render geographic data from a TopoJSON file containing world land and country boundaries, all drawn as SVG elements.

Mmbostock

70% match