mcpField
R
remotion-maps

remotion-maps

github.com/remotion-devCreative & media5.8k200.2k installsUpdated 2d ago
Repository

About remotion-maps

A Remotion skill for choosing and applying a map technique for a shot. It covers static maps, Mapbox, MapLibre, MapTiler, and CesiumJS, each with different requirements and capabilities.

Key features

  1. 01Selects one map technique per shot
  2. 02Static map using a satellite image
  3. 03Mapbox styles and globe view
  4. 04MapLibre without an API key
  5. 05MapTiler geographic annotations
  6. 06CesiumJS terrain flythroughs

Use cases

  1. 01Adding a static map to a shot
  2. 02Animating a Mapbox or MapLibre map
  3. 03Annotating geographic features with MapTiler
  4. 04Creating terrain flythroughs with CesiumJS

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/remotion-dev/skills --skill remotion-maps

After installing, type/remotion-mapsin Claude Code to confirm it loaded.

Bundled files

References and scripts installed along with SKILL.md.

agents/
openai.yaml
assets/
remotion-icon.svg
techniques/cesium/
TECHNIQUE.md
techniques/cesium/assets/
cesium-path.json
CesiumFlythrough.tsx
city-path.json
example-Root.tsx
flight-path.ts
sample-river.geojson
techniques/cesium/references/
3d-data-sources.md
3d-flyover-architecture.md
3d-troubleshooting.md
techniques/cesium/scripts/
prep-cesium-path.mjs
techniques/mapbox/
TECHNIQUE.md
techniques/mapbox/references/
render-stability.md
techniques/maplibre/
TECHNIQUE.md
techniques/maplibre/references/
render-stability.md
techniques/maptiler/
TECHNIQUE.md
techniques/maptiler/assets/
CountryLabel.tsx
example-Root.tsx
MapTilerVectorElement.ts
RiverReveal.tsx
tokens.ts
techniques/maptiler/assets/sample-data/
country-meta.json
yarlung-flow.json
techniques/maptiler/references/
map-data-sources.md
map-explainer-architecture.md
map-geo-prep.md
render-stability.md
techniques/maptiler/scripts/
prep-geo.mjs

Details

From the project README

Remotion Maps

Choose exactly one technique from the intended shot, then load only that technique's TECHNIQUE.md. Every technique directory is self-contained and may be removed without breaking the others.

Static map

  • Requires you grab a satellite image and mount it in a <Img> tag, and animate on top

Mapbox

  • Requires a Mapbox key
  • Nicer styles by default
  • Map can display a round globe when zoomed out
  • Includes nice 3D buildings such as the Eiffel tower

MapLibre

  • Requires no API key, fully free
  • Does not include 3D building

MapTiler

  • Uses MapTiler
  • Annotations can be drawn on top of geographic features: borders, rivers, labels

CesiumJS

  • Flythroughs through terrain and mountains
  • "Flight simulator" perspective

Comments

Markdown supported