设计与多媒体

map-animation

iart-ai/map-ani…n-skills

This skill should be used when the user asks to "make a Vox-style map animation", "animate a map zoom", "draw a route on a map", "highlight a country/region", "use Google Earth Studio", "drop pins on a map and animate them", "pan/orbit a camera over a map", or "add map graphics to an explainer video". Covers Earth Studio→After Effects camera import, GeoJSON/SVG vector map motion, pins/routes/highlights/labels, the 12fps stutter cadence, and data-driven Remotion renders.

  • 859 次安装
  • 21 星标
  • 收录于

安装命令

npx skills add https://github.com/iart-ai/map-animation-skills --skill map-animation

SKILL.md

Map Animation

Build editorial, "Vox-style" animated maps: a camera that zooms, orbits, and pans over a base map while location pins drop, routes draw on, regions highlight, and labels call out — all snapped to a deliberate 12fps stutter so motion reads as graphic, not photographic. Two production paths: photoreal base motion from Google Earth Studio composited in After Effects, and code-renderable vector maps (GeoJSON/SVG) driven from a coordinates array in Remotion or D3.

When to use

  • A documentary/explainer beat that establishes place: zoom from globe to city, orbit a landmark, pan along a border.
  • Show movement across geography: a route drawing between two points, a supply chain, a migration, a flight path.
  • Highlight a country, state, or region and label it; build a step-by-step geographic walkthrough.
  • Turn a list of coordinates/events into a repeatable, data-driven map sequence for video.

Pick the path

You need Path Output
Photoreal terrain, real satellite/3D buildings, cinematic camera Google Earth Studio → After Effects Image sequence + camera .jsx, composited in AE
Clean editorial vector look, full control, data-driven Vector (GeoJSON/SVG) in Remotion or D3 Code-rendered MP4/GIF or web SVG
Pins / routes / highlights / labels on top of either Overlay layer AE shape/null layers OR React/SVG components