使い方は、たった5ステップ
むずかしい設定は不要です。場所を選んでボタンを押すだけで、Illustratorで編集できる地図SVGが手に入ります。
- ① 場所をさがす
上部の検索欄に住所や施設名（例：「鹿児島市 天文館」）を入れて検索するか、地図をドラッグ＆ズームして、地図化したい範囲を画面に収めます。目安は一辺2km以内。広すぎると生成できません（ズームインしてください）。
- ② スタイルを選ぶ
「標準」のほか、「線画モノクロ」や、案内図らしくスッキリ見せる直角デフォルメ（模式図）などから選べます。生活道路の有無・施設アイコンの表示なども、詳細設定でオン／オフできます。
- ③「この範囲でベクター地図を生成」を押す
ボタンを押すとOpenStreetMapからデータを取得して描画します。数秒〜十数秒ほど。時間がかかりすぎたら「リセット」で止められます。
- ④ レイヤーを確認する
道路・建物・緑地・水域・鉄道・注記・施設アイコンなどが、種類ごとにレイヤー分けされて表示されます。プレビューはドラッグで移動、Option＋スクロールで拡大縮小できます。
- ⑤ SVGをダウンロード → Illustratorで編集
「SVGをダウンロード」を押すと、レイヤー構造を保ったSVGが書き出されます。Illustrator（またはInkscape等）で開けば、色・線幅・文字・不要な要素の削除まで自由に仕上げられます。
きれいに作るコツ
- 範囲は「主役」が中心に来るよう調整：お店やイベント会場を中心に、目印になる大通りや駅が入るくらいがちょうど良いです。
- 広すぎ注意：範囲が広いと情報が多すぎて生成が重く、案内図としても見にくくなります。少しズームインを。
- 直角デフォルメは"案内図"向き：実際の形より、分かりやすさ重視の模式図にしたいときに。北の向きマークも入ります。
- ラベル言語：右上の言語切替で、地名・施設名を日本語／英語に切り替えられます。海外向けの制作にも。
- 要らない要素はイラレで消す：出力後、レイヤー単位・オブジェクト単位で不要なものを削れば、目的に合った地図に仕上がります。
How to use — 5 steps
- 1. Find your location
Search an address or place name, or drag/zoom the map to frame the area (aim for under ~2 km across). Too wide won't generate — zoom in.
- 2. Choose a style
Standard, monochrome line art, or the right-angle schematic ("deformed") style. Toggle minor roads and facility icons in advanced settings.
- 3. Press "Generate vector map of this view"
It fetches OpenStreetMap data and draws it (a few to ~15 seconds). Use Reset to stop.
- 4. Review the layers
Roads, buildings, green, water, railways, labels and icons come out as separate layers. Drag to pan, Option+scroll to zoom the preview.
- 5. Download the SVG → edit in Illustrator
The SVG keeps its layer structure. Open it in Illustrator or Inkscape and restyle colors, strokes and text freely.
Tips
Center your subject (shop / venue) with a nearby main street or station in frame; don't go too wide; use the schematic mode for clean access maps; switch label language top-right; and delete anything you don't need after export.