maverickmaltin/map-route

/map-route: 두 장소, 3D 지도, 스스로 그려지는 경로

사용자가 두 장소를 말합니다("타임스퀘어에서 엠파이어스테이트까지", "런던에서 파리까지", "리스본에 있는 내 호텔에서 공항까지"). 당신은 장소를 찾고, 실제 경로를 얻고, 프레임을 확인한 후 비디오를 렌더링하여 무음 MP4(약 4.5초)를 제공합니다.

${CLAUDE_SKILL_DIR}는 이 스킬의 폴더(현재 SKILL.md가 있는 폴더)입니다. 환경에서 자동으로 채워지지 않으면 해당 폴더 경로를 직접 사용하세요. 모든 파일은 사용자의 현재 폴더 또는 사용자가 지정한 폴더에 저장하세요. 이 스킬은 인터넷 연결이 필요합니다(지도 검색, 경로 및 지도 타일).

0. 설정 확인

python3 "${CLAUDE_SKILL_DIR}/scripts/render.py" --check

몇 초 정도 걸립니다. 이 컴퓨터가 설정되어 있는지 확실하지 않으면 실행하세요. "ready": true이면 진행합니다. 그렇지 않으면 "fix" 아래에 나열된 명령어를 실행하고, 사용자에게 일회성 설치임을 알리세요: python3 -m pip install playwright (브라우저 드라이버), python3 -m playwright install chromium (Google Chrome이나 Edge가 설치되어 있지 않은 경우에만, 약 150MB), python3 -m pip install imageio-ffmpeg (ffmpeg가 없는 경우에만). pip가 "외부 관리 환경(externally managed environment)" 오류를 내면, 개인 환경을 한 번 만들고 모든 명령어에 해당 Python을 사용하세요: python3 -m venv ~/.animate-skills && ~/.animate-skills/bin/pip install playwright imageio-ffmpeg, 필요한 경우 ~/.animate-skills/bin/python -m playwright install chromium. Windows에서는 python3 대신 py를 사용하세요.

1. 장소와 경로 찾기

각 장소를 지도 검색에 충분히 구체적으로 만드세요: 도시(모호한 경우 국가)를 추가하세요: "엠파이어스테이트" → "Empire State Building, New York". 그런 다음:

python3 "${CLAUDE_SKILL_DIR}/scripts/route.py" "Times Square, New York" "Empire State Building, New York" \
  --labels "Times Square" "Empire State Building" --out map-<시작>-<도착>.json

• --labels: 핀과 카드에 표시될 짧은 이름입니다.
• --mode: auto (기본값: 직선 거리 4km 미만이면 도보, 900km 미만이면 운전, 그 이상이거나 도로 연결이 없으면 비행), walk, bike, drive, fly. 사용자가 요청한 모드를 사용하세요("~에서 운전해...", "~로 비행해..."). 같은 도시의 두 명소는 보통 도보입니다: 사용자가 달리 말하지 않았다면 최대 약 5km까지 --mode walk를 전달하세요.
• --style: light (기본값), dark, color. --title "..."는 카드의 "A → B" 줄을 대체합니다.
• --units: auto (두 장소 모두 미국이나 영국에 있으면 마일), metric, imperial. --size: 1080x1920 (기본값), 1080x1080, 1920x1080.

찾은 내용을 출력합니다. from과 to 줄이 사용자가 의도한 장소인지 확인하세요 (올바른 도시, 올바른 건물; 박물관은 입구 중 하나로 표시될 수 있으며 괜찮습니다). 아니라면 검색 텍스트를 더 구체적으로 만들어 다시 실행하세요(최대 몇 번까지): 이는 무료 커뮤니티 서버이므로 한 번에 하나의 요청만 가능합니다.

장소는 좌표("40.7580,-73.9855")나 도로명 주소일 수도 있습니다.

2. 마지막 프레임 확인

python3 "${CLAUDE_SKILL_DIR}/scripts/render.py" map-<시작>-<도착>.json --still end --out map-<시작>-<도착>-check.png

이미지를 확인하세요(제작에 약 10초 소요): 두 핀과 그 이름이 화면에 보이고, 경로가 명확하며, 카드가 올바른지(거리, 시간, 모드) 확인하세요.

3. 비디오 렌더링

python3 "${CLAUDE_SKILL_DIR}/scripts/render.py" map-<시작>-<도착>.json --out map-<시작>-<도착>.mp4

약 30-60초 소요: 모든 프레임이 실제 지도 타일을 기다립니다. 렌더링 결과가 검게 나오거나 빈 화면이면 --no-gpu를 추가하세요. 확인 이미지를 삭제하세요.

4. 전달

사용자에게 MP4 파일 경로를 알려주고(환경에서 파일을 표시할 수 있으면 보여주세요), 함께 표시된 거리와 시간을 알려주세요. 소리는 없습니다. 하나의 변형(어두운 스타일, 다른 모드, 더 긴 버전)을 제안하세요.

스펙은 일반 JSON입니다: 핀 이름(from.name, to.name), title, subtitle (거리 줄을 대체), style, color (경로의 색상) 또는 duration (초, 기본값 약 4.5; 더 길게 하면 전체 움직임이 느려짐, 예: 7로 설정하면 더 차분한 버전)을 변경하고 경로 검색 없이 다시 렌더링할 수 있습니다.

인터넷 접속 불가 시

지도는 실시간 지도 타일과 라우팅 서버가 필요합니다. 네트워크에 접속할 수 없는 샌드박스(또는 브라우저가 없는 경우)에서는 가짜 지도를 그리는 대신 사용자에게 그 사실을 알리세요.

지도 데이터 © OpenStreetMap 기여자 (ODbL), 타일 by OpenFreeMap (OpenMapTiles 스키마), 경로 by OSRM on FOSSGIS 서버. 저작자 표시 줄은 비디오에 유지됩니다.