## 淺談開放街圖(OpenStreetMap)<br>及其生態系
---
<!-- .slide: data-background="#FFFFFF" -->
### About me
<img width="300px" src="https://hackmd.io/_uploads/S1sB6N89h.png">
- 謝晉凡(typebrook)
- OSM, 登山, Unix
- 曾任究心公益科技(Android)
- 待業中
---
# The Basics
---
## Compare to Google Maps
----
## 軟體資源有幾個層次
- 原始資料(從現實世界取得的資訊)
- 服務(API、加值過後的資料)
- 產品(最終使用到的軟體)
----
## Google Map 是「產品」
- ~~原始資料~~(你接觸不到)
- 服務
- Map SDK
- POI/Navigation API
- 產品
- Google 地圖: www.google.com/maps/
- 我的地圖
- Android/iOS: 地圖
- Google Earth
----
## OSM 是「資料庫」
- [ 原始資料 ](https://planet.openstreetmap.org/pbf/planet-230417.osm.pbf.torrent)
- 使用開放資料庫授權
- 服務
- [圖磚 API](http://b.tile.openstreetmap.org/15/27430/14142.png)
- [資料庫 API](https://www.openstreetmap.org/api/0.6/node/3874898356)
- ~~產品~~
---
## Everyone owns OSM
- 一份地理資料集/庫,有制度、有社群
- 使用 ODbL 授權
- 由 OSMF (開放街圖基金會) 保護、推廣、支持
**但不擁有**
---
## How it works?
- Postgres: https://wiki.openstreetmap.org/wiki/Database
- Budget: https://wiki.osmfoundation.org/wiki/Board/Minutes/2023-02/Budget
----
<!-- .slide: data-background="#FFFFFF" -->

---
## Why it rocks?
- Community Driven, no one dominates
- [ODbL](https://wiki.openstreetmap.org/wiki/Legal_FAQ)
- [使用案例](https://hackmd.io/@osm-tw/rkhoFl9jO#/5)
---
# 資料長什麼樣?
---
## OSM 只包含三
| 種類 | id | tag | 地理資訊 |
|:--------:|:---:|:---:|:----------:|
| node | 有 | 有 | 座標 |
| way | 有 | 有 | nodes |
| relation | 有 | 有 | ways/nodes |
---
## 取得資料
- 好想工作室
https://openstreetmap.org/node/7602886831
- XML格式 (試著加上.json)
https://openstreetmap.org/api/0.6/node/7602886831
- L棟倉庫創意生活館
https://openstreetmap.org/api/0.6/way/204493492
- 公園里
https://openstreetmap.org/api/0.6/relation/3756152
----
## 依照條件取得資料
- 依照地名/關鍵字: osm.org
https://www.openstreetmap.org/search?query=
- tag 統計: taginfo
http://taginfo.openstreetmap.org/
- 依照 type/tag: Overpass
https://overpass-turbo.eu/
- 依照貢獻方式: OSM Change Analyzer
https://osmcha.mapbox.com/
-
## 取得整份資
- Planet
https://planet.openstreetmap.org/pbf
- Extract
http://download.geofabrik.de/asia/taiwan-latest.osm.pbf
----
## 自行分析資料
- [GDAL](https://gdal.org/drivers/vector/osm.html)
- 使用 ogr2ogr 轉換格式
- 使用 SQL 語句進行篩選
- [osm-c-tools](https://github.com/ramunasd/osmctools)
- osmconvert 轉換格式
- osmfilter 進行篩選
- [osmium](https://osmcode.org/osmium-tool/)
- 直接進行格式轉換和篩選
---
## 如何使用?
切換到 OSM 生態系
----
## Why?
別跟錢錢過不去!
----
[開發口罩地圖 他收60萬帳單驚呆了](https://tw.news.yahoo.com/%E9%96%8B%E7%99%BC%E5%8F%A3%E7%BD%A9%E5%9C%B0%E5%9C%96-%E4%BB%96%E6%94%B660%E8%90%AC%E5%B8%B3%E5%96%AE%E9%A9%9A%E5%91%86%E4%BA%86-132018239.html)

---
## 模式1<br>底圖 + 資料
----
### Case 展示點/線/面資料
[口罩地圖](https://kiang.github.io/pharmacies/)

----
## 使用相關圖磚服務
- openstreetmap.org
- OSM WIKI
- [Ready to use](https://wiki.openstreetmap.org/wiki/Using_OpenStreetMap#Ready-made_online_maps)
- [Tile Provider](https://wiki.openstreetmap.org/wiki/Tiles#Tile_providers)
- [Maptiler](https://www.maptiler.com/data/pricing/)
- [Stamen](https://stamen.com/)
----
## 使用相關框架
- Switch to OSM
-
https://switch2osm.org/the-basic
- Integrate OSM by default
- [Leaflet](https://leafletjs.com/examples/quick-start/)
- [Openlayers](https://openlayers.org/en/latest/examples/simple.html)
- [Maplibre](https://maplibre.org/)
- [Mapzen/tangram](https://www.mapzen.com/)
---
## 模式2<br>在圖磚中塞入向量資料
----

----
### Case: 自由變換使用語言
[Example](https://documentation.maptiler.com/hc/en-us/articles/4405445343889-How-to-set-the-language-for-your-map)

----
### [MVT (Mapbox Vector Tile)](https://docs.mapbox.com/help/glossary/vector-tiles/):
- 使用 [Protobuffer](https://raw.githubusercontent.com/mapbox/vector-tile-spec/master/2.1/vector_tile.proto) 格式來紀錄地理資料
- Tile -> Layer -> Feature
- 由 Schema 決定儲存的資料
- [Vector Tile Provider](https://wiki.openstreetmap.org/wiki/Vector_tiles#Providers)
- 依照框架調整渲染方式:
- [Mapbox/Maplibre style spec](https://maplibre.org/maplibre-style-spec/)
- [Trangram Scene FIle](https://tangrams.readthedocs.io/en/main/)
- 使用線上編輯器調整樣式:
- [Maputnik](https://maputnik.github.io/editor/)
- [Maptiler](https://cloud.maptiler.com/maps/editor)
---
## 模式3<br>擁有自己的圖磚服務!
----
### 想像一下,在底圖以外<br>要呈現的資料有上百萬個!
----
### Case: [台電電桿品質檢視](https://lists.openstreetmap.org/pipermail/talk-tw/2021-October/001463.html)
- [頁面連結](https://topo.tw/osm/taipower-import.html)

----
### [Brandon Liu](https://coscup.org/2023/zh-TW/session/TKMDCL) COSCUP 2023 (07/30)

----
### PMTiles and OSMExpress
- [OSMExpress](https://github.com/protomaps/OSMExpress)
- 使用單一檔案提供查找
- S2 Geometry: 快速產生地理搜尋結果
- [可以提供快速切片服務](https://app.protomaps.com/downloads/small_map)
- [PMTiles](https://protomaps.com/docs/pmtiles)
- 使用單一檔案提供 Tile Service
- S3 friendly! low-cost, zero-maintenance!
---
## 其它應用方式
- 資料庫
- [imposm](https://imposm.org)
- 產生向量圖磚
- [OpenMapTiles](https://openmaptiles.org)
- [tilemaker](https://tilemaker.org/)
- Terrain RGB
- [3D 地型](https://osmhacktw.github.io/terrain-rgb/3d.html)
- [等高線](https://onthegomap.github.io/maplibre-contour)
---
## 手機/電腦端
- Mapbox/Maplibre/Maptiler SDK
- 需要更加考慮離線方案
- rudymap.tw !
---
## Contritubion 增刪~~查~~改
{"title":"淺談 OSM 及其生態系","description":"使用 ODbL 授權","contributors":"[{\"id\":\"a1b5e992-a59d-4fde-a34d-2348fd92f043\",\"add\":6784,\"del\":1000}]"}