An antique map paints itself in four inks, repairing clashes one Kempe chain at a time.
Ink borders are rasterized onto a grid and flood fill turns the land between them into countries; two countries are neighbors when they share a stretch of border, not a single corner, and that adjacency is the dual graph. Coloring follows Kempe's 1879 induction: peel off countries with at most five neighbors, then paint them back in reverse, and when a country already touches all four inks, swap two colors along a Kempe chain (every country reachable through those two colors) so that one ink is freed. Countries with five neighbors are flagged as the case Heawood showed Kempe's proof gets wrong, and if no single swap works the map says so and shuffles chains until one does. The watercolor is a per-pixel pigment layer whose density pools at each country's edge through a distance transform, granulates with noise, and spreads from a seed point when a country changes ink, under marching-squares coastlines and sea hatching.
Try it. Drag across the map to draw a new border: loose ends are extended to the nearest border or coast, the country splits, and the solver repairs the coloring. Click a country to repaint it with the next ink by hand and watch its clashing neighbors get repaired. Dual graph (D or Space) shows capitals and adjacencies, Recolor (R) starts over from bare paper and New map (N) surveys a new continent.
Paste this into Claude Code, Codex or any coding agent to get a simple version running, then take it wherever you like.
Build a "four color map" toy with JavaScript and the HTML canvas element: I draw borders, and the program colors the countries with four colors so that no two neighbors match. Put everything in a single index.html file with no libraries or build step, so I can open it directly in a browser.
Start simple:
- Make a canvas that fills the window, stays sharp on high-DPI screens (scale by devicePixelRatio), and resizes with the window. Use a warm parchment background.
- Keep the map as a grid of about 200 by 125 cells drawn scaled up. Let me drag to draw borders: mark every cell the stroke passes through (a little thicker than one cell) as border, and draw the stroke itself as a dark ink line.
- After each stroke, flood fill the non-border cells to find the countries. Two countries are neighbors if border cells touch both of them in several places.
- Color greedily: visit the countries one at a time and give each the first of four colors not used by its neighbors.
Once that works, make it beautiful:
- When a country's neighbors already use all four colors, use a Kempe chain: pick two colors a and b and a neighbor colored a, collect every country reachable from it through countries colored a or b, swap a and b along that chain, and check that color a is now free.
- Animate each step: highlight the chain, then let the new color flood outward across each country over half a second.
- Give it a watercolor look: draw each country's color into a small image where the pigment gets darker near the country's edge and varies with a little noise, then scale it up smoothly under the ink lines.
Explain the Kempe chain trick in short code comments. When you're done, tell me how to open it and suggest three directions I could take it next, such as generating a whole continent with noise-shaped coastlines, showing the dual graph of capitals, or highlighting the five-neighbor case where Kempe's 1879 proof went wrong.
