CHAPTER 06
地図タイルを作成・配信する
自分で用意した地図データ(GeoTIFFやGeoJSONなど)をタイル化して配信すると、EcorisMapの「地図の追加」で読み込んで使えます。この章では、EcorisMapで使える3つの形式の作り方と配信方法を紹介します。
| 形式 | 元データ | 向いている用途 |
|---|---|---|
| XYZラスタタイル | GeoTIFF等の画像 | 空中写真、スキャンした図面、解析結果の画像 |
| ラスタPMTiles | 同上 | 上と同じ内容を1ファイルで配信・共有したい場合 |
| ベクトルタイル(PMTiles) | GeoJSON等のベクタデータ | 植生図・区画などの大きなポリゴン/ラインデータを軽く表示 |
XYZラスタタイルの作成
元データは位置情報付きの画像(GeoTIFFなど)を用意します。座標系は自動で変換されますが、Webメルカトル(EPSG:3857)にしておくと確実です。
方法1:QGISで作る(GUIで手軽)
- QGISに元データ(GeoTIFF等)を読み込み、表示を整えます。
- プロセッシングツールボックスから「ラスタツール > XYZタイル(ディレクトリ)」を実行します。
- 範囲、最小/最大ズームレベル(例:8〜16)、出力先フォルダを指定して実行します。
{z}/{x}/{y}.png形式のフォルダが生成されます。
方法2:gdal2tilesで作る(コマンドライン)
gdal2tiles.py --xyz -z 8-16 input.tif tiles/
--xyzを必ず付けます。付けない場合はTMS形式になり、EcorisMap側で「Y軸反転」のチェックが必要になります。-zでズームレベル範囲を指定します。
方法3:ラスタPMTilesにまとめる(1ファイル配信)
GDALでMBTilesを作り、go-pmtilesでPMTilesに変換します。
gdal_translate -of MBTILES input.tif output.mbtiles
gdaladdo -r average output.mbtiles 2 4 8 16
pmtiles convert output.mbtiles output.pmtiles
gdaladdoは低ズーム側(広域表示用)のタイルを作るために必要です。
ヒント: ズームレベルを1つ上げるとタイル数は約4倍になります。ラスタは特に容量が膨らみやすいため、必要な範囲とズームに絞って作成してください。目安は、広域が12〜14、詳細が必要な範囲のみ16〜18です。
高いズームまで作る必要はありません。EcorisMap側で「固定ズーム」を作成した最大ズームレベルに合わせて設定すれば、それ以上拡大してもタイルが引き伸ばされて表示され続けます。容量を抑えたいときに有効です。設定方法は地図を用意するを参照してください。
ベクトルタイルの作成
GeoJSONなどのベクタデータは、tippecanoeでベクトルタイル形式のPMTilesに変換するのが手軽です。
tippecanoe -o vegetation.pmtiles -pf -pk -Z 5 -z 20 -l vegetation input.geojson
-o 出力.pmtiles— PMTiles形式で直接出力します。-pf -pk— タイルあたりの地物数・サイズの上限による間引きを無効にします。データをそのまま全部入れる指定です。-Z 5 -z 20— 最小/最大ズームレベル。表示したい範囲に合わせて調整します。-l レイヤ名— タイル内のレイヤ名。スタイルファイルのsource-layerで参照します。- 複数のGeoJSONを渡して複数レイヤのタイルにすることもできます。
メモ: 作成したPMTilesファイルを pmtiles.io にドラッグ&ドロップすると、表示内容・ズーム範囲・レイヤ名などをブラウザ上で確認できます。ラスタPMTilesの確認にも使えます。
スタイルファイルの用意
ベクトルタイルには表示スタイル(色・線種など)を定義したスタイルファイル(JSON)が必要です。
- MapLibre Style Specの
layersの書式に準拠します。EcorisMapは基本的な項目のみサポートします。 - サンプルがstyle_sampleにあります。
source-layerにtippecanoeで指定したレイヤ名を書きます。 - スタイルファイルはタイルと同じ場所で配信するか、地図編集画面のフォルダボタンから端末内のファイルとして読み込みます。
タイルの配信
タイルは静的ファイルなので、Webサーバーや静的ホスティングサービスに置くだけで配信できます。
XYZタイル(フォルダ)の場合
- 生成した
{z}/{x}/{y}.pngのフォルダ構造をそのままアップロードします。 - EcorisMapには
https://例のサーバー/tiles/{z}/{x}/{y}.pngの形式で登録します。
PMTilesの場合
- 1ファイルをアップロードするだけです。ただし配信側がRange Request(部分取得)に対応している必要があります。Amazon S3、Cloudflare R2、GitHub Pagesなど主要なサービスは対応しています。
- EcorisMapには
https://例のサーバー/vegetation.pmtilesの形式で登録します。詳しくは地図を用意するを参照してください。
ホスティングサービスの例
| サービス | 特徴 |
|---|---|
| GitHub Pages | 無料・手軽。リポジトリ1GB・1ファイル100MBの目安あり。小〜中規模向け |
| Cloudflare R2 / Amazon S3 | 大容量向け。PMTilesの配信先として定番。CORSを設定可能 |
| 自前のWebサーバー | 社内配信など。Range RequestとHTTPSに対応していること |
注意点
- Web版で使う場合はCORSの許可が必要です。配信側で
Access-Control-Allow-Originを設定してください。モバイル版のみで使う場合は不要です。 - HTTPSでの配信を推奨します。
- 公開データを元にした場合は、元データの利用規約に従い、EcorisMapの「出典表記」に出典を記載してください。
- アクセスを制限した配信もできます。 署名付きURLの仕組みにより、組織アカウントでログインしたユーザーだけが取得できるように配信できます。利用者側の操作は不要です。配信サーバー側の対応が必要なため、運営元にお問い合わせください。
EcorisMapへの登録
作成したタイルは、地図選択画面の「追加」からURLを登録して使います。ベクタタイルのチェック、スタイルURL、透過などの登録項目については地図を用意するを参照してください。「固定ズーム」に作成した最大ズームレベルを設定しておくと、それ以上拡大しても地図が表示され続けます。
- 配信せずに使う場合:PMTilesファイルを端末に転送し、地図選択画面の「インポート」から読み込みます。
- 動作確認は、まずモバイル版で表示し、次にズーム・パンの快適さを確かめ、必要ならWeb版でCORSを確認する順がおすすめです。