Skip to content
fr

Real-time 3D mapping for React

map3D

map3D is a real-time 3D mapping library for React by Alban Pasquelin: a photorealistic globe on Google 3D Tiles down to street level, DOM markers and clusters, a geospatial drawing editor, an imperative Three.js engine under a declarative surface.

import { TypeScript, React19, Threejs, WebGL } from '@/stack'
export function renderGlobe(tiles: Photorealistic3DTiles): Map3DSurface {

A photorealistic globe you can travel from orbit to pavement without a seam. The buildings are the real buildings, textured from Google 3D Tiles.

<Map3D tiles={googlePhotorealistic3DTiles} mode='pedestrian' />

You place markers on it, they cluster automatically when they overlap, and you can drop into pedestrian mode. You draw on top of it the way you would in Figma: shapes, measurements, geolocated annotations, with GeoJSON import and export.

map.add(<Markers cluster />).add(<DrawingEditor geojson />)

Underneath, an imperative and heavily optimised Three.js engine. On top, a declarative React API made of components. The developer never sees the engine unless they need it.

export const surface = declarative(imperativeThreeEngine)
return {
declarativeApi: 'React 19', /** declarative API **/
symbologySupported: 'MIL-STD-2525D', /** symbology supported **/
}
}

← Projects