UNVT naru を使ってOSMからベクトルタイルを作る

## はじめに
### 趣旨
ベクトルタイルでいろいろと試して見る際に、背景地図を使って見たいときがあります。今回、OpenStreetMapをUNVTのツール（[naru](https://github.com/unvt/naru)）を使ってベクトルタイルにしました。具体的には、unvtでは技術移転を目的とした naru というパッケージがありますが、これをつかって国ごとのosmデータ（pbfファイル）をベクトルタイルに変換したので、そのやり方をメモしておきます。

### OpenStreetMap（OSM）について
この場で詳しく説明することはしませんが、OpenStreetMapは世界中のマッパーが編集しているオープンな地図です。利用にあたっては、ライセンス以外にも位置精度や地物の信頼性などの注意すべき点はあると思いますが、私もテスト用などに利用する場合があります。

### OpenStreetMapをベクトルタイルに変換するには
OpenStreetMapをベクトルタイルに変換する方法は、MapTilerを使う方法などもあり、[ベクトルタイル Advent Calendar 2021](https://qiita.com/advent-calendar/2021/vt)の13日目（kanahiroさんによる[tilemakerを使って爆速でOSMベクタータイルを作る](https://qiita.com/Kanahiro/items/6a98ee285d3de7ac61fc)）の記事が大変参考になります。

一方、unvtのツールを使っても、OSMのデータ（osm.pbf）をベクトルタイルに変換することが出来ます。実際に (optgeo)[https://github.com/optgeo] の[kokoromiシリーズ](https://github.com/optgeo/kokoromi)などでもosmデータをベクトルタイルに変換していたりします。私は、慣れたツールで、将来的に自分でデータの構造をいじりたいという思いもあり、今回はunvtのツールでosmデータを変換しました。

### unvt/naruについて
UNVTでは技術移転を目的とした [naru](https://github.com/unvt/naru) というパッケージがあります。[naru](https://github.com/unvt/naru)は開発から少し時間がたっているので、古くなった部分もありますが、まだ使えます。naruではDockerを使っているので、Windowsユーザーでも簡単にベクトルタイル作成等の作業をすることが出来ます。

* 私自身はmaptilerでのベクトルタイル変換を試していませんが、naruを使うとconfigセッティングやmodify.jsなどを編集することでベクトルタイルの属性などを編集することができるので柔軟に設計できるというメリットもあると思います。タイルのデータサイズを適切にするためには、このfilter.jsとmodify.jsの調整が重要になってきます（慣れてきた方向け）。
* 開発当時、UNVTではDockerベースで動くツールを多く利用していました。現在はラズベリーパイなど、本物のLinux環境を指向している部分がありますね。

慣れている方は、unvt/naruのレポジトリを見ればこの使い方がわかると思いますが、初心者の方の参考にもなるかもしれないので自分自身の作業手順メモをここに残しておきます。

## 作業した環境
* Windows 10 (Enterprise)
* Docker version 20.10.8
* PowerShell version 5.1.19041.1237


## 手順

### Step 1: GitHubレポジトリーをコピー
自分のPCに作業フォルダを作ります。パワーシェルでそのフォルダに移動したのちGit cloneでレポジトリをコピーしてきます。そしてそこに移動します。

```bash
git clone https://github.com/unvt/naru
cd naru
```

レポジトリがコピーされていることも確認します。（下の図は私の作業環境の例）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/679143/be15e5f5-024d-1399-4d07-1e2cf476c402.png)


### Step 2: 地域の設定
.env.exampleを参考にして、.env を作ります。拡張子はちがいますが、これらはテキストファイルですのでテキストエディタで作成できます。例えば、ウクライナのOSMデータ（ukraine-latest.osm.pbf）を使いたい場合は以下の様にしておきます。このとき、データ変換だけなら SITE_ROOT は使わないので、デフォルトのままにしておいても大丈夫です。
地域の指定は https://download.geofabrik.de を参考にして、REGIONとAREAを指定します。

```
REGION=europe
AREA=ukraine
SITE_ROOT=http://localhost:9966
```

### Step 3: Dockerイメージの作成とDockerコンテナの起動
naruの中には Dockerfile が入っています。ですのでこれを使ってDockerイメージを作ります（docker build）。そしてDockerコンテナをスタートします（docker run）。作業ディレクトリを/dataに関連付けているので（-vオプション）、Dockerを起動したら/dataフォルダに移動しておきます。

```bash
docker build -t naru .
docker run -it --rm -v ${PWD}:/data -p 9966:9966 naru
cd /data
```
runの時に、念のためポート9966をつなげてありますが、ポートはベクトルタイル作成作業ではつけなくても大丈夫です。（下の図では私の環境なのでポート8080を使っています。）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/679143/0a4a1b2d-6d57-0152-1aab-70d46b1a46ed.png)


### Step 4: rakeファイルの確認
naruではrubyが入っていて、rakefile（[こちら](https://github.com/unvt/naru/blob/master/Rakefile) ）で作業を簡単に実施することができます。rubyのバージョンと、rakeタスクの一覧を以下の様に確認してみます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/679143/08251943-f9c6-df1a-acf3-74ad36f6343a.png)
rakeの作業がいろいろありますね。今回は、inet:downloadとtilesという作業をすることになります。これらが何をやっているのかはnaruの中のRakefileを見ると確認することができます（再掲・[こちら](https://github.com/unvt/naru/blob/master/Rakefile) ）。

### Step 5: osmファイルのダウンロード
Step 2において、.envファイル中で地域の設定をしていますが、そこで指定したデータをダウンロードすることができます。

```
rake inet:download
```
とすることで、ダウンロードがスタートします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/679143/456a12ab-f347-a8c2-23f1-ceb69d4e9232.png)

* ダウンロードのミラーサイトはRakefileの中で指定していますが、https://download.geofabrik.de/ になっています。
* ダウンロードされたファイルはsrcフォルダの中にあります。
* srcフォルダに "（area名）-latest.osm.pbf" という ファイルがあるかどうか判断してからダウンロードしているので、ファイルを更新する場合は古いファイルを削除しましょう。

### Step 6: ベクトルタイル作成
ベクトルタイルの作成もRakefileのタスクとして実行できます。

```
rake tiles
```

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/679143/50b11886-3976-94bd-828b-893c950cbfe9.png)![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/679143/85e91ede-cb1a-0273-96f5-ec2fa9f96156.png)


地域によっては、時間がかかるので、しばらく待つ場合があります。これでdocsフォルダのzxyフォルダにpbfのベクトルタイルができますし、srcフォルダに tiles.mbtiles という名前でmbtiles形式のベクトルタイルができます。なお、rake tilesではsrcフォルダ中にtiles.mbtilesがない場合に変換が実施されるので、更新したい場合は古いファイルを削除するか、Rakefile中のコマンドを編集しましょう。

これでベクトルタイルができました。用途に応じて、zxyタイルとmbtielsを使っていけます。



### Step 7:　確認
最後にベクトルタイルが出来ていることを確認します。
mbtilesがsrcフォルダの中に出来ています。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/679143/95b27e78-5d0a-f4e3-b74d-89cbfb22339a.png)
zxyフォルダ中にpbf形式でのベクトルタイルが入っています。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/679143/cb63ae5b-d581-56f1-dbec-cecb2f6a1cb8.png)


## まとめ と コメント
今回、OpenStreetMapデータ（osm.pbf）から、ベクトルタイルを作ることができました。
そのほかのコメントや今後に向けてのポイントは以下の通りです。

* スタイルについては、naruではhoconを使ってstyle.jsonを作るというアプローチをとっています。これは、unvt/charitesが開発される前に我々がとっていた方法です。rakeのコマンドでスタイルを作れるので、naruで作ったベクトルタイル（デフォルトのままの場合）用のスタイルがほしい人は、rake sytleを実行すれば、docsフォルダの中にstyle.jsonが生成されます。
* OpenStreetMapの魅力は、ライブ更新というか、クラウドソーシングでどんどん更新されていくことだと思います。今回のベクトルタイル作成は、ミラーサイトからOSMデータをダウンロードしていますので、データベースの更新頻度や更新時期についてはミラーサイトを確認しましょう。
* UNVTでは最近はラズベリーパイをつかって作業を行っています。したがって、naruは今後あまり更新されないかもしれませんが、前述のようにstyleの作業にcharitesを使うようにしたり、nodejsのバージョンを更新したり、少しメンテナンスの余地があります。
* naruにはベクトルタイルの作成だけでなく、sprites（地図記号等）の作成など、ベクトルタイルの作成、スタイリング、ホスティングの練習ができるようになっています。興味がある方は探検してみてください。
* 作ったベクトルタイルをホスティングする方法はこの記事では書きません。zxyタイル（pbf）形式が1GB以下ならGitHubのページでのホスティングがいいと思いますし、もしも1GB以上であれば、mbtilesをnodejsサーバーでホスティングするのがよいと思います。（[こちらの記事](https://qiita.com/T-ubu/items/545d9f995ef7496a2ec4)が参考になるかもしれません。）
* Dockerの中でやっていることをLinuxサーバーで実施して、crontabで定期的なタスクにしてしまえば、osmソースのベクトルタイルを簡単に更新することも可能だと思います。

## References
* OpenStreetMap https://www.openstreetmap.org
* UNVT naru https://github.com/unvt/naru
* OpenStreetMap Data Extracts https://download.geofabrik.de/
* tilemakerを使って爆速でOSMベクタータイルを作る https://qiita.com/Kanahiro/items/6a98ee285d3de7ac61fc