One hundred kilometers around Paris, compressed into a 5-by-5 strategy-game board. Museums, monuments, universities, parks, castles, arenas, and transport hubs become civic resources on an isometric landscape.
100 km
DBpedia search radius
Île-de-France · landmark survey
A civic resource map
Showing the validated Paris snapshot while DBpedia is checked.
Grid detailMore cells reveal more landmarks; sprites shrink to preserve the board footprint. CityMuseumMonumentFaithGreen spaceUniversityCastleArenaTransportCroplandGrasslandForestUrban
Geography in, game board out
The layout receives ordinary longitude and latitude records. It converts them into local kilometer offsets, assigns each landmark to a grid cell, and chooses one representative per cell using an explicit civic-interest rank followed by proximity. This lets a city such as Oakland take precedence over a less distinctive feature in the same cell.Paris is explicitly pinned to the center. Zooming changes grid resolution without changing geographic extent; count badges expose cells containing additional candidates.
A GeoFrame custom layout
Each diamond is a data-bearing GeoFrame area node, so polygon hit-testing, keyboard navigation, tooltips, observation events, accessibility, canvas rendering, and server rendering remain frame responsibilities. The pixel buildings are an SVG overlay anchored to the same layout result.
JSX
import { GeoCustomChart } from "semiotic/geo" import { isometricLandmarkLayout } from "semiotic/recipes" const city = cityOptions[selectedCity] const detail = zoomLevels[zoomIndex] <GeoCustomChart points={landmarks} projection="equirectangular" layout={isometricLandmarkLayout} layoutConfig={{ center: city.center, centerId: city.center.id, ...detail, gridRadiusKm: 65, // Replace any placeholder without changing layout geometry: sprites: { culture: "/sprites/museum.png" } }} />
Replaceable pixel assets
The supplied transparent PNG resources render between 44 and 96 pixels as grid detail changes; the major city scales from 64 to 132 pixels. Supply replacement URLs throughlayoutConfig.sprites to replace categories without changing tile geometry or anchors.
Landmark candidates are requested from theDBpedia SPARQL endpointusing a 100 km spatial filter. A checked-in, spatially validated snapshot keeps the example deterministic when the public endpoint is slow, unavailable, or returns insufficient coverage. Ocean coverage was sampled procedurally from Natural Earth coastline geometry.