# vector tile academy (wip) <font color="gray">/ ベクトルタイル・アカデミー(作業中)</font> :::info TODO 書けるところから書いていって姿を見せていく。 - [x] h2, h2, h3 の英語、日本語はそれぞれではなくて、/ 区切りで書くようにする。インデックスの見通しを良くするため。 ::: :::info The document will be in English. After initial completion, we may add internationalization. Before that, all sentences in different languages will be translated in English. ::: :::info ここで私が作ろうとしているのは、昔の Linux の伝統で言う、HOWTO 文書かもしれない。 ::: # Purpose of this document/この文書の目的 # Intended audience/想定読者 ベクトルタイルの生産、ホスト、スタイリング、最適化を一通り設計・実施したいエンジニア。 # Principles to be introrduced in the beginning/<font color="gray">最初に共有すべき原則</font> <font color="gray">UNVT の基本的な考えは、100ドルで誰でも入手できる環境を提供することで最新のウェブ地図技術を誰でも使えるようにすることである。</font> <font color="gray">UNVT は「自分の地図をウェブでも生き残らせたい」という人を支援することを目標に設計されている。</font> <font color="gray">なぜ UNVT は汎用万能パッケージではないか。それは、ソースデータの特性が様々だからである。最良の効率を実現するためには、ソースデータの特性に合わせて UNVT を適切にデプロイする必要がある。</font> # Preparing the hardware ## Raspberry Pi 4B - Raspberry Pi 4B - PC - Power connection to Raspberry Pi - Ethernet connection between Raspberry Pi and the PC - MicroSD card ### Installing Raspbian TODO # Clone the work reposotory # Download the source data Download the data and bring it to the session. The session venue does not nesessarily have an Internet connection. https://download.geofabrik.de/europe/switzerland-latest.osm.pbf (caution! this is a direct link to the megabytes of data.) # Preparing the toolkit/<font color="gray">ツールキットの準備</font> ## `nanban` for or Docker with Intel CPU/Intel CPUのDocker ``` docker run -ti --rm -v $(pwd):/root/work unvt/nanban ``` ## `equinox` for Raspbian on Raspberry Pi<font color='gray'>/Raspberry Pi の Raspbian</font>font> ``` curl -sL https://unvt.github.io/equinox/install.sh | bash - ``` :::info It is always a good idea to know what the command is doing. You can check what you are doing by not piping to the shell: ``` https://unvt.github.io/equinox/install.sh ``` ::: # Designing vector tiles<font color="gray">/ベクトルタイルの設計</font> <font color="gray">ベクトルタイルの設計は、実際にはベクトルタイルの生産とスタイル付けをしながら反復的に行なっていくことになります。しかし、ベクトルタイルを設計するとはどういうことなのか、ということについて本節では解説します。</font> ## how does a vector tile specification look like? | source data layer | vector tile layer | minzoom | maxzoom | vector style layers | | --- | --- | --- | --- | --- | | Building | building | 15 | 15 | buliding # Production of vector tiles <font color="gray">/ベクトルタイルの生産</font> # Hosting the vector tiles <font color="gray">/ベクトルタイルのホスト</font> ## Tiles<font color="gray">/タイル</font> ## Files other than tiles<font color="gray">/タイル以外のファイル</font> ### Mapbox GL JS #### Compile to latest Mapbox GL JS<font color="gray">/最新の Mapbox GL JS をコンパイルする</font> ##### to install for the first time ```zsh git clone https://github.com/mapbox/mapbox-gl-js ``` ##### to get the latest version ```zsh cd mapbox-gl-js yarn run build-prod-min yarn run build-css ``` We will be using `dist/mapbox-gl.js`, `dist/mapbox-gl.css`, and `dist/mapbox-gl.js.map`. `mapbox-gl.js.map` is optional. See also [CONTRIBUTING.md](https://github.com/mapbox/mapbox-gl-js/blob/master/CONTRIBUTING.md#creating-a-standalone-build). # <font color="gray">ベクトルタイルのスタイル付け</font> HOCON で Mapbox Studio で Maputnik で :::info Maputnik は Mapbox Style の Expression に対応していないため、ベクトルタイルの性能を最大限に発揮することができない状態になっていることから、Mapbox Studio よりも低い優先度で紹介することになる。 ::: # <font color="gray">ジオポータルとベクトルタイルの関係</font> ## <font color="gray">原則論</font> ベクトルタイルの設計は、ジオポータルのクラシカルなレイヤモデルと異なる。一つのスタイルファイル、一つの `source` で地図を表現するのがベクトルタイルにおいては最も効率的である。 既存のジオポータルにベクトルタイルを接続しても、ベクトルタイルの最大の性能を得られるわけではない。他方で、接続すれば既存の画像タイルよりは高い性能が得られる可能性が高い。 やむを得ず既存のジオポータルに接続せざるを得ない場合には、次の「相互運用手段」を用いる。 ## <font color="gray">相互運用手段</font> 知りうる限りは、Mapbox GL JS で構築されたジオポータルは存在しない。Mapbox GL JS 以外のライブラリでのベクトルタイル対応は性能が出ておらず、これを使えば画像タイルよりも低い性能になってしまう。 このため、 # Contribution of UNVT to UN global agendas ## SDGs ### 9 Goal 9. Build resilient infrastructure, promote inclusive and sustainable industrialization and foster innovation ### 9.a. > Facilitate sustainable and resilient infrastructure development in developing countries through enhanced financial, **technological and technical support** to African countries, least developed countries, landlocked developing countries and small island developing States. ### 17 Goal 17. Strengthen the means of implementation and revitalize the Global Partnership for Sustainable Development ### 17.16 - Systemic issues - Multi-stakeholder partnerships - > Enhance the Global Partnership for Sustainable Development, complemented by **multi-stakeholder partnerships** that mobilize and **share knowledge, expertise, technology** and financial resources, to support the achivement of the Sustainable Development Goals in all countries, in particular developing countries ### 17.9 - Capacity-building - (potentially) > Enhance international support for **implementing effective and targeted capacity building** in developing countries to support national plans to implement all the Sustainable Development Goals, including through North-South, South-South and triangular cooperation ## SF ### 24. (c) To develop, periodically update and disseminate, as appropriate, location-based disaster risk information, including risk maps, to decision makers, the general public and communities at risk of exposure to disaster in an appropriate format by using, as applicable, geospatial information technology ### 25. (o) To enhance collaboration among people at the local level to disseminate disaster risk information through the involvement of community-based organizations and non- governmental organizations # FAQ ## UNVT を使ったサイトを運営するとき、attributionにはなんと入れた方がいいでしょうか? ありがとうございます。UNVT はツールでしかないので、attribution は不要です。Microsoft Word で作ったファイルに Microsoft の attribution を入れる必要はない、それと同じだ、というイメージでお考えください。 その上で、UNVT への言及をご希望いただけるようであれば、例えば "Powered by the United Nations Vector Tile Toolkit" といった言葉を適宜入れていただけると嬉しいです。Apache で運用しているサイトに、任意で Powered by Apache といったバナーを入れていた昔の慣習のようなイメージでお考えください。 # Appendix :::info ## 対訳辞書 production/produce 生産(する) hosting/host ホスト(する) styling/style スタイル付け(する) optimization/optimize 最適化(する) :::