Pixel map

The same choropleth, sampled into dots

One row per country, joined and classed exactly as a choropleth would be. The difference is the mark: a lattice is laid over the map, every point that lands inside a country becomes one of its dots, and the borders are never drawn. You read them where one colour gives way to the next.

177
Countries
0
Dots
0
SVG paths
Shape
Grid on
Lattice
3°
80%

Illustrative data. A smooth field over the globe, identical on every load. Geometry Natural Earth 1:110m, built-in registry Projection as selected, cropped below 58°S

What was passed

A choropleth with a different mark

The data, the join and the scale are the choropleth's, so an existing choropleth becomes a pixel map by changing its type. The legend, tooltips, selection, keyboard focus and drilldown come with it, because each country is still one element: its dots are one path, and the outline underneath them is an invisible hit target, so the gaps between dots belong to the country they sit in.

series: [{
  type: 'pixel',
  joinBy: 'name',
  data,
  shape: 'circle',   // 'square' | 'hexagon' | 'diamond'
  grid: 'geo',       // or 'screen'
  spacing: 3,        // degrees on 'geo', pixels on 'screen'
  size: '80%',       // of spacing, or a number of pixels
}]

Shape and lattice

Every shape tiles at 100%

The lattice follows the shape unless you pick one. Squares sit in a square grid, circles and hexagons stagger every other row by half a step and pack the rows closer together, and diamonds interlock at half a step, which is a square grid turned through 45°. Push the size slider to 100% and each one closes up without a seam: hexagons into a honeycomb, diamonds into a lattice, squares into a solid grid.

Sizes past 100% are clamped. Beyond it neighbours overlap, and which one ends up on top is decided by drawing order rather than by anything on the map.

Two grids

Fixed to the ground, or to the screen

Both start from the same even lattice. grid: 'geo' lays it over the map once, as the map opens, and from then on every dot is a place: zoom in and the dots grow with the land under them, because a dot stands for the same patch of ground wherever the camera goes. grid: 'screen' keeps the lattice on the screen instead, so zooming in refines it rather than magnifying it. It is resampled at the same quantized zoom levels clustering and hexbins use, so a pan never resamples and a smooth zoom crosses a level a handful of times.

grid: 'geo' · the dots belong to the ground
grid: 'screen' · the dots belong to the reader

Because the geo lattice is laid on the map as drawn, it is even on any projection, and on an equal-area one like Equal Earth every dot also covers the same area of ground. On Mercator the dots are just as even and the ground under them is not: a dot in Greenland stands for a fraction of the land a dot in Brazil does. That is Mercator's distortion rather than the lattice's, and a pixel map makes it unusually easy to see.

On a globe

The lattice turns with the world

A globe only accepts the geo grid, and lays it on the sphere rather than on the map, because the map as it opens is one hemisphere and the reader can turn to the other. Rows run along the parallels and each wraps the world exactly once, so there is no seam to roll into view, and equalArea (on by default) thins them towards the poles so a dot covers the same ground at 60°N as at the equator. A spin reprojects points sampled once, with no resampling. Dots shrink towards the horizon as the surface turns away. Drag to spin it.

Small places

No country disappears for being small

At this spacing most of Europe's microstates fall between lattice points. A pixel map that left them out would be a choropleth silently dropping rows, so a region that catches no point takes the nearest free one, or borrows one from a neighbour that has dots to spare. Luxembourg, Malta and Liechtenstein each get a dot here. Hover them.

When a region is wedged between neighbours that hold only one dot themselves, there is nothing to borrow, and the map says so in development mode rather than hiding it: the diagnostics name every region left out and suggest a smaller spacing.