Maps

RemotionUI spatial components use MapLibre GL JS and Turf for deterministic map animations.

Install

npx remotion-ui add map-flight

Determinism rules

• interactive: false, fadeDuration: 0
• delayRender() until map idle on load and per-frame updates
• Turf for geodesic routes — do not hand-roll coordinate math
• Separate target route (line animation) from camera route (camera position)

Render flags

WebGL maps require ANGLE and single concurrency:

npx remotion render MapFlight out/map.mp4 --gl=angle --concurrency=1

Components

See map-flight for the flagship example.