社会科系の教科書や学習参考書では、世界地図・日本地図のベクターデータを作ることがよくあります。
トレースで作るには時間がかかりすぎるし、正しい海岸線の形や国の塗り範囲を把握するのは大変なことです。制作できる専用アプリがあるといいですね。
実際にそういったアプリは存在し、QGISなどが利用可能です。ただ、そもそも元となる地理データを自力で用意する必要がある、できるベクターデータのアンカーポイントが多く重くなりがち、などの課題がありました。
したたか企画では、地図の制作にD3.jsとTopoJSONを利用しています。パスの省略の仕方が絶妙で、シンプルかつパスファインダーで操作しやすい、編集に強いベクターデータになるからです。
今回は、そのシンプルで編集に強い地図を生成するためのアプリを用意しました。さまざまな透視図法で世界地図のベクター画像を描画し書き出すアプリ、Zueを紹介します。
例えば次のような地図を作れます。


目次
動画で見てみたい
あらましを教えて
ミラー図法や正距方位図法などさまざまな透視図法で世界地図のベクター画像を描画し書き出すアプリです。名前はZue(図絵)といいます。
地図の詳細度や視点の中心座標を変えたり、海岸線や国境など要素ごとに表示/非表示を切り替えたりしてお好みの地図ベクターデータを作れます。

作った後はそれをプリセットとして保存して再利用したり、SVGとして書き出してAdobe IllustratorやFigmaなど編集アプリで加工したりできます。
書き出したベクターデータは、要素ごとに層が分かれていて編集が容易です。

国の塗りはIllustratorでいう複合パスになっていて、どういうまとまりにするかの1つの答えがすでに用意されています。またオブジェクトにJPNなどの識別子がついているため、どれが何の国/地域なのかをオブジェクト名から判別できます。間違いを防げますね。

したたか企画ではAdobe IllustratorやFigmaなど何らかのサービスの機能拡張として機能を提供することが多いのですが、このZueは独立したアプリです。それらは必須ではありません。
ZueはTauriと言う技術で作られたmacOS・Windows両対応のマルチプラットフォームアプリケーションです。インストーラはそれぞれのOS用に分かれ、2つあります。
どのバージョンに対応してるの?
次の通りです。
macOS用(app)
- macOS 10.15以上に対応。macOS 10.15(Intel),11.7/12.7/13.6/14.3/15.7/26.1(Apple Silicon)で動作を確認
Windows用(exe)
- Windows 10以上に対応。Windows 10/11で動作を確認
どうやってインストールするの?
macOS用にはdmgファイルで、Windows用にはexeファイルでインストーラを用意してあります。ダウンロードして開けば指示が出るので、それに従って進めればOKです。
インストールが済んだらZueアプリを開いてみてください。ウインドウが出てきたら成功しています。

起動しない/動かない
セキュリティの関係でOSやセキュリティソフトが動作をブロックすることがあります。いくつか例を挙げますのでご対応をお願いします。
macOS
インターネットからダウンロードしてきた、開発者未登録のアプリケーションはユーザーが起動を許可する必要があります。

macOS 14(Sonoma)までは、右クリックしてコンテクストメニューから[開く]を選ぶと簡単に許可できます(開発元が未確認のMacアプリケーションを開く(macOS 14) – Apple サポート)。
macOS 15(Sequoia)からは右クリックからの起動ができなくなったようです。かわりに、システム設定 > プライバシーとセキュリティ > セキュリティ > アプリケーションの実行許可 を開いてください。そこに出る[このまま開く]ボタンを押すと起動できるようになります(開発元が未確認のMacアプリケーションを開く(macOS 15) – Apple サポート)。

Windows
セキュリティソフトMicrosoft Defender SmartScreenがインストーラの実行を止めることがあります。その場合詳細情報を押してください。実行ボタンが出て進められるようになります。

どう使うの?
アプリを起動すると、日本付近を中心としたミラー図法の地図が表示されます。パネル左の地図設定や右のレイヤーを適宜変更して地図を作ってください。

SVGとして書き出す
表示中の地図を、ベクター画像形式のSVGファイルとして保存できます。
1. 画面左側のパネルの下のほうにある書き出しボタンを押す、メニューのExport…を選ぶなどして、書き出しを実行する
2. ダイアログで保存先を指定する

これでもうSVGファイルとして保存ができています。任意のアプリで加工するなどしてご利用ください。
地図内容をお好みで変更する
サイズや図法・表示レイヤーなど、世界地図の内容を指定し変更できます。
画面左側のパネルで地図のサイズや図法などを変更してください。適用ボタンを押すなどして更新したときに実際に表示されます(入力ごとに更新すると動作が遅いためそうなっています)。
画面右側のパネルでは、レイヤー(要素)ごとに使用・不使用を指定できます。必要に応じて変更してください。
地図内容をプリセットとして保存する
指定した地図内容はプリセットとして保存できます。このプリセットが、アプリZueがメインで扱う「書類」にあたります。SVGは単なる書き出し結果で、SVGから地図内容を復元することはできないのでご注意ください。
1. メニューのSave As…を選ぶなどして別名保存を実行する
2. ダイアログで保存先を指定する

プリセットは拡張子「.zuep(Zue Preset)」のファイルです。この拡張子をアプリZueに関連づけると、FinderやExplorerでのダブルクリックにてZueで開けるようになります。
プリセットを開く
プリセットファイルを開くと、保存した通りの状態で地図を表示できます。
1. メニューのOpen…を選び、処理を実行する
2. ダイアログで保存先を指定する

3. もし表示中の地図設定がまだ保存されていなければ、ダイアログでそれを破棄するかどうかを選ぶ

Finder/Explorerでプリセットファイルを開くか、ウインドウにドロップなどすると直接そのファイルの設定を適用できます
オリジナルのスタイルを読み込む
地図内の線の太さや色などのプリセットは、CSSをもとにしたJSONでできています。それを作成・編集することで、あなたの好みのスタイルプリセットを適用できるようになります。
サンプルのJSONがありますのでご利用ください。細かいことを言うと種類はjsoncなので、コメントと末尾のカンマを含んでいても正常に読み込めます。
1. メニューのImport Style…を選び、処理を実行する
2. ダイアログで読み込むスタイルファイルを指定する

3. もし表示中の地図設定がまだ保存されていなければ、ダイアログでそれを破棄するかどうかを選ぶ

地図内容はどんな項目が設定できるの?
メインウインドウ左右のパネルで、地図の詳細を指定できます。
🔢 サイズ
Pixel単位の地図の寸法を指定する項目です。Wは幅、Hは高さを表します。
🔽 図法
メルカトル図法や正距方位図法など、地図の透視図法を指定する項目です。

🔽 詳細度
地図の細かさを指定する項目です。単純・やや単純・単純・中間・精細の5段階から選択してください。
🔢 視点中心 (度)
地図の中心となる座標を指定する項目です。Xは経度、Yは緯度を表します。例えば東京は[140, 35]くらいです。
Yの緯度は、図法によっては0に固定されます。
🔢 切り抜き範囲 (度)
視点中心を基準に、どこまでを表示範囲として切り抜くか角度で指定する項目です。おもに円錐図法や方位図法で使います。
🔽 スタイル
地図内の線の太さや色などのプリセットを指定する項目です。初期設定ではScreen・Print・Black & Whiteの3つから選べます。
📁 レイヤー
外枠(frame)や海岸線(coast)などオブジェクトの種類ごとの有効/無効を切り替えたり、レイヤー名を指定する項目です。書き出したSVGをAdobe IllustratorやFigmaなどの編集アプリで開いても、設定は反映された状態になります。
Adobe Illustratorではレイヤーでなくグループになり、それに指定した名前がついている状態になります。必要なら、レイヤーパネルから「サブレイヤーに分配 (シーケンス)」を選ぶことでレイヤーに変えられます。
Figma・Adobe XDではそれぞれグループになります。これらのアプリではレイヤーとグループの区別はありません。
環境設定ではどんなことが設定できるの?
アプリを起動した状態で、メニューのPreferences…(macOSのバージョンによってはSettings…)を選ぶと環境設定画面が開けます。ショートカットはmacOSではcommand+K、WindowsではCtrl+Kです。


🔽 Language(言語)
UIの表示言語です。JapaneseとEnglishの2つから選べます。この項目の表示はどの言語を選んでも英語のままになります。
🔽 視点移動ルール
キーボードショートカットやメニューから、地図の中心点(視点中心)を地球儀を回転するように一定度数ずらすことができます。その一定度数がどのように決まるかを表す項目です。
固定角度で回転
次の「視点移動固定角度 (度)」で指定した角度で視点を移動します。
経緯線間隔で回転
地図の設定「経緯線間隔 (度)」で指定した角度で視点を移動します。
経緯線間隔の半分で回転
地図の設定「経緯線間隔 (度)」で指定した数値の半分の角度で視点を移動します。例えば経緯線間隔が30の場合は15度、10の場合は5度回転します。
🔢 視点移動固定角度 (度)
視点移動ルールを固定角度で回転にしているときに使う角度の数値です。
地理データの出典は何で、書き出したベクター地図は権利的に使えるの?
内部で使っている地理データは、パブリックドメイン で公開されている Natural Earth のデータをもとに、したたか企画が編集したものです。
書き出した結果のベクター地図(SVGなど)は、ユーザーのあなたが自由に公開・編集・販売可能です。つまり、権利的に使えます。
ただし、地理データ(TopoJSON・GeoJSONなど)を再配布・販売等で直接利用することはできません。Zueアプリ内でご利用いただきますようお願いします。
詳細は Zue利用規約 をご参照ください。
よくある質問と答え(FAQ)
買いたい!
今回のアプリZueは、macOS/Windows用アプリをセットで販売しています。noteに出店していて、特にアカウントを作らなくても購入できます。ご購入1つ分につき、端末2台までインストール・ご利用可能です。
note で買う:6000円


