Antarctica’s centroid

100%

Antarctica’s centroid

✓ Published0🌍 Public

Last edited Feb 25, 2017

Created on Feb 25, 2017

This example computes the geographic centroid of Antarctica using the `d3.geoCentroid` method on a GeoJSON MultiPolygon loaded from a local file. It then renders the continent with an azimuthal equal-area projection via `d3.geoAzimuthalEqualArea`, drawing the polygon and a graticule using `d3.geoPath`. The SVG output displays the resulting center of mass and the map, demonstrating how D3 handles projected spherical geometry. The notebook uses a Node.js environment with the `d3` module.

AI-generated description

Similar vizzes

Loading thumbnail…

Gist a4cce0757b78ab1918ce592718da6a33

This example visualizes the centroid of Antarctica, showing how it is calculated and where it falls on a map. It uses D3’s `d3.geoCircle` and `d3.geoCentroid` to compute the centroid of a circular polygon centered on the South Pole, then loads an Antarctic GeoJSON file to find the continent’s actual centroid. The map is rendered as SVG using `d3.geoPath` with an azimuthal equal-area projection, including a graticule, to display the result.

PPhilippe Rivière

90% match

Loading thumbnail…

Antarctica’s Centroid explained

The visualization uses the D3.js library (v4) with an orthographic projection to display a map of Antarctica. It contrasts the correct spherical centroid, computed via `d3.geoCentroid`, shown as an orange dot, with the naïve planar centroid from the `d3.geoPath` centroid method, shown as a black dot. Both are projected onto the SVG using the `d3.geoOrthographic` projection, highlighting the inaccuracy of planar calculations for polar regions. The underlying GeoJSON data defines Antarctica’s multipolygon, and the graticule is added using `d3.geoGraticule`.

PPhilippe Rivière

90% match

Loading thumbnail…

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

Loading thumbnail…

Polar Azimuthal Equal-area

This example visualizes the Earth using the polar azimuthal equal-area projection, with landmasses in black and country boundaries in white against a graticule. The map is centered on the North Pole and rendered as an SVG, with a sphere outline and fill. The code uses `d3.geo.azimuthalEqualArea()` for the projection and `d3.geo.path()` to draw features from a TopoJSON world dataset loaded via `d3.json`.

Mmbostock

71% match

Loading thumbnail…

New York Centroid Fixed

This example demonstrates a workaround for a known issue in d3-geo where computing the centroid of a geographic feature collection can produce inaccurate results. It visualizes New York City neighborhoods on a Mercator projection, with orange and red dots marking computed centroids. The code uses `d3.geoCentroid` and `d3.geoPath` to project and render the data. A fix is applied by including the centroids as a MultiPoint feature in the projection's `fitExtent` calculation, ensuring the map is properly scaled and centered on the data.

PPhilippe Rivière

71% match

Loading thumbnail…

Country Centroids on a Map

This example plots the centroids of countries on an equirectangular world map using D3 v3, rendering each centroid as a translucent pink circle. The map displays graticules, land masses, and country boundaries, with centroids computed via `d3.geo.path().centroid()` on TopoJSON features from a world-50m dataset. Users can pan and zoom the entire visualization through `d3.behavior.zoom`. The code also includes an unused CSV file of invitation chains, though the map itself only visualizes geographic centroids.

CCurran Kelleher

69% match

Loading thumbnail…

melting-antarctica

A world map rendered in a Mollweide projection is drawn on an HTML canvas using D3's `d3.geoMollweide` and `d3.geoPath`. The map's pixel data is extracted via Canvas `getImageData`, and each pixel's color is iteratively shifted inward toward the center based on its radial distance, creating a melting effect where landmasses appear to collapse into the pole. The animation runs with `d3.interval`, processing pixels sorted by radius to simulate a gradual dissolution.

11wheel

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

69% match