Communitygithub.com

maverickmaltin/map-route

2地点間のルートを自ら描画する3Dマップ動画を生成します(1080×1920 MP4)。「/map-route」で2地点を指定するか、ルート・旅行・道案内のアニメーションを任意に依頼できます。

map-route とは?

このスキルは、ユーザーが指定した2地点間の実際のルートを、3Dマップ上でアニメーション描画するMP4動画(約4.5秒、無音)を生成します。Times Square→Empire State Buildingのような観光地間、London→Parisのような都市間、さらには座標や住所にも対応。ルート検索にはOSRM、地図タイルにはOpenFreeMapを使用し、歩行・自転車・自動車・飛行機の移動モードを自動または手動で選択可能です。マップのスタイル(light/dark/color)、尺(秒数)、解像度(1080×1920、1080×1080、1920×1080)をカスタマイズでき、出力後にタイトルやルート色を変更して再レンダリングすることもできます。主にClaude CodeやターミナルベースのAIエージェント向けで、インターネット接続とPlaywright/Firefoxが必要です。セットアップチェック機能で依存関係を確認し、不足時には自動インストール手順を提供します。

対応✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/maverickmaltin/claude-animate-skills/tree/HEAD/skills/map-route

お気に入りのAIに質問する

このエージェントスキルを事前に読み込んだ状態で新しいチャットを開きます。

ドキュメント

/map-route: 2地点、3Dマップ、ルートが自ら描画される

ユーザーが2つの場所(「Times SquareからEmpire Stateまで」「LondonからParisまで」「リスボンのホテルから空港まで」)を指定します。あなたはそれらを検索し、実際のルートを取得し、フレームを確認し、動画をレンダリングして無音の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がインストールされていない場合のみ、約150 MB)、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」→「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-<from>-<to>.json
  • --labels:ピンとカードに表示される短い名前。
  • --mode:auto(デフォルト:直線距離4 km未満は徒歩、900 km未満は自動車、それ以上または道路接続がない場合は飛行機)、walk、bike、drive、fly。ユーザーのリクエストに合わせて使用します(「車で…」「飛行機で…」)。同じ都市内の2つの観光地は通常徒歩です:特に指定がない限り、約5 kmまでは --mode walk を渡します。
  • --style:light(デフォルト)、dark、color。--title "..." でカードの「A → B」行を置き換えます。
  • --units:auto(両方の場所が米国または英国の場合はマイル)、metric、imperial。--size:1080x1920(デフォルト)、1080x1080、1920x1080。

検出結果が出力されます。from 行と to 行がユーザーの意図した場所であることを確認してください(正しい都市、正しい建物か;博物館はその入口の1つとして表示されることがありますが、問題ありません)。違う場合は検索テキストをより具体的にして再実行します(多くても数回まで)。これらは無料のコミュニティサーバーであり、一度に1リクエストです。

場所は座標("40.7580,-73.9855")や住所でも指定できます。

2. 最終フレームを確認する

python3 "${CLAUDE_SKILL_DIR}/scripts/render.py" map-<from>-<to>.json --still end --out map-<from>-<to>-check.png

画像を確認します(作成に約10秒):両方のピンとその名前が画面に表示され、ルートがはっきり見え、カード(距離、時間、移動手段)が正しいですか?

3. 動画をレンダリングする

python3 "${CLAUDE_SKILL_DIR}/scripts/render.py" map-<from>-<to>.json --out map-<from>-<to>.mp4

約30〜60秒:各フレームは実際の地図タイルの読み込みを待ちます。レンダリングが黒または空白になった場合は --no-gpu を追加してください。確認用画像は削除します。

4. 提供する

ユーザーにMP4のパスを渡し(環境がファイル表示をサポートしている場合は表示する)、表示されている距離と時間も伝えます。音声はありません。バリエーション(ダークスタイル、別のモード、長いバージョン)を1つ提案します。

仕様はプレーンJSONです:ピン名(from.name、to.name)、title、subtitle(距離行を置き換えます)、style、color(ルートの色)、duration(秒、デフォルト約4.5;長くすると動き全体が遅くなります。例:7で落ち着いたバージョン)を変更して、再度検索せずに再レンダリングできます。

インターネット接続がない場合

地図はライブの地図タイルとルーティングサーバーを必要とします。ネットワークアクセスがない(またはブラウザがない)サンドボックス環境では、偽の地図を描く代わりにそのことをユーザーに伝えてください。

地図データ © OpenStreetMap contributors(ODbL)、タイル by OpenFreeMap(OpenMapTilesスキーマ)、ルート by OSRM(FOSSGISサーバー)。帰属表示は動画に残ります。

Individual skills in this repo

This repo contains 4 individual skills — each has its own dedicated page.

関連スキル