你的地圖會說話？WebGIS 與 JavaScript 的情感交織（iT邦幫忙鐵人賽系列書）

購買商店

---

你的地圖會說話？WebGIS 與 JavaScript 的情感交織（iT邦幫忙鐵人賽系列書）

$468.00

馬上購買

---

內容描述

---

解鎖地圖與JavaScript相遇的秘密
 
全國第一本介紹WebGIS開發與實戰應用的實體書籍！

本書提供範例程式下載，事半功倍一學即上手！

WebGIS啟蒙首選✖五家地圖API✖近百個程式範例✖實用簡易口訣✖學習難度分級✖補充ES6小知識

內容簡介

本書內容改編自第12屆iT邦幫忙鐵人賽，Modern Web組佳作網路系列文章－《你的地圖會說話？WebGIS與JavaScript的情感交織》。

在人手一台智慧型手機，運用Google地圖查詢餐廳位址的時代，您是否會好奇這些地圖功能是如何透過程式實作的呢？本書會從最基礎開始，帶您進入WebGIS的奇幻旅程。

❖給完全沒有WebGIS及地圖domain knowhow的你
👉本書將從最基本的地理資訊系統概念談起，從概念到程式實作一應俱全，完全沒接觸過GIS的讀者依舊能輕鬆上手！

❖給網頁開發的初學者與擔心看不懂書內範例程式的你
👉別擔心！本書會詳細介紹JavaScript程式的實作細節，並採用ES6以後的語法，讓您學習地圖開發之餘，還能學習到最新的JavaScript程式語法！

❖給覺得Google Map API收費高，而想轉戰其它地圖API的你
👉本書統整五家地圖API，包括：Google Map API、Here Maps API、ArcGIS API、TGOS Map API、Leaflet API，無論您在不同的情境下想使用不同的地圖API (皆含範例程式碼) ，本書是您最好的入門聖經！

❖給已會使用Leaflet API製作簡單的口罩地圖，但還希望更進一步加深功力的你
👉常見的口罩地圖實作的是WebGIS的展點功能，本書除了展點外，還有：圖層套疊、定位、環域查詢、群聚、熱區等等……，不勝枚舉的WebGIS實戰應用，等你來挑戰！

好評推薦

這本書的內容是非常適合初學者自學上手的WebGIS入門教材，從地理圖資的常見格式，再來深入淺出的解說運用網路資源進行資料擷取、設定、展示與分析等。這是一本讓所有想要瞭解如何開發地圖應用程式的任何人，都能一窺WebGIS實用且充滿趣味的技術領域。
溫在弘
國立臺灣大學地理環境資源學系教授
國立臺灣大學理學院空間資訊研究中心主任
中華民國地圖學會理事長

目錄大綱

---

PART I 初學者的試煉

Chapter01 地圖 API 的選擇？
1.1 與 WebGIS 的邂逅
1.1.1 GIS 是什麼？
1.1.2 初始化地圖的四步驟
1.1.3 常見的地圖屬性設置
1.2 大眾化的 Google Map API
1.2.1 申請 Google Map API Key
1.2.2 初始化地圖（Google Map API）
1.3 導航豐富的 Here Maps API
1.3.1 申請 Here Maps API Key
1.3.2 初始化地圖（Here Maps API）
1.4 GIS 界老字號 ArcGIS API for JavaScript
1.4.1 初始化地圖（ArcGIS API for JavaScript）
1.5 台灣ㄟ雄厚 TGOS Map API
1.5.1 申請 TGOS Map API Key
1.5.2 初始化地圖（TGOS Map API）
1.6 輕量化的世代 Leaflet API
1.6.1 初始化地圖（Leaflet API）

PART II GIS 資料格式

Chapter02 向量資料格式
2.1 網格與向量
2.2 點資料圖徵
2.2.1 點資料圖徵（Google Map API）
2.2.2 點資料圖徵（Here Maps API）
2.2.3 點資料圖徵（ArcGIS API for JavaScript）
2.2.4 點資料圖徵（TGOS Map API）
2.2.5 點資料圖徵（Leaflet API）
2.3 線資料圖徵
2.3.1 線資料圖徵（Google Map API）
2.3.2 線資料圖徵（Here Maps API）
2.3.3 線資料圖徵（ArcGIS API for JavaScript）
2.3.4 線資料圖徵（TGOS Map API）
2.3.5 線資料圖徵（Leaflet API）
2.4 面資料圖徵
2.4.1 面資料圖徵（Google Map API）
2.4.2 面資料圖徵（Here Maps API）
2.4.3 面資料圖徵（ArcGIS API for JavaScript）
2.4.4 面資料圖徵（TGOS Map API）
2.4.5 面資料圖徵（Leaflet API）

Chapter03 網格資料格式
3.1 OGC 規範
3.2 WMS 圖層套疊
3.2.1 WMS 圖層套疊（Google Map API）
3.2.2 WMS 圖層套疊（Here Maps API）
3.2.3 WMS 圖層套疊（ArcGIS API for JavaScript）
3.2.4 WMS 圖層套疊（TGOS Map API）
3.2.5 WMS 圖層套疊（Leaflet API）
3.3 WMTS 圖層套疊
3.3.1 WMTS 圖層套疊（Google Map API）
3.3.2 WMTS 圖層套疊（Here Maps API）
3.3.3 WMTS 圖層套疊（ArcGIS API for JavaScript）
3.3.4 WMTS 圖層套疊（TGOS Map API）
3.3.5 WMTS 圖層套疊（Leaflet API）

Chapter04 複合型資料
4.1 複合型資料的優勢
4.2 KML 圖層套疊
4.2.1 Google Earth 製作KML
4.2.2 KmlLayer 與 Geoxml3（Google Map API）
4.2.3 KML 圖層套疊（Here Maps API）
4.2.4 KML 圖層套疊（ArcGIS API for JavaScript）
4.2.5 KML 圖層套疊（TGOS Map API）
4.2.6 KML 圖層套疊（Leaflet API）
4.3 GeoJSON 圖層套疊
4.3.1 JSON 再進化 >> GeoJSON
4.3.2 GeoJSON 圖層套疊（Google Map API）
4.3.3 GeoJSON 圖層套疊（Here Maps API）
4.3.4 GeoJSON 圖層套疊（ArcGIS API for JavaScript）
4.3.5 GeoJSON 圖層套疊（TGOS Map API）
4.3.6 GeoJSON 圖層套疊（Leaflet API）

PART III GIS 查詢功能

Chapter05 定位查詢
5.1 瀏覽器定位
5.1.1 navigator
5.1.2 地理位置定位（Geolocation Web API）
5.1.3 定位及標記點
5.2 坐標定位
5.2.1 坐標系統
5.2.2 坐標系統轉換
5.2.3 坐標定位及滑鼠事件
5.3 地址定位
5.3.1 Leaflet 地址定位
5.3.2 Google Map Geocoding API
5.3.3 全國門牌地址定位服務
5.4 行政區定位
5.4.1 TGOS Map API 行政區定位
5.4.2 透過 GeoJSON 載入行政區

Chapter06 展點與環域
6.1 展點
6.1.1 上傳 GeoJSON
6.1.2 上傳 Excel
6.1.3 呼叫 API 並展點
6.2 環域
6.2.1 圓形環域
6.2.2 面環域
6.3 繪圖事件
6.3.1 Leaflet Draw 繪圖工具
6.3.2 繪圖結合圓形環域
6.3.3 繪圖結合面環域
6.3.4 繪圖結合矩形環域

PART IV 高手雲集的殿堂

Chapter07 SQL Spatial
7.1 MSSQL 環境安裝
7.2 空間資料格式
7.2.1 WKT(Well-known text)
7.2.2 WKB(Well-known binary)
7.2.3 平面與球體
7.2.4 點線面與資料集合
7.3 幾何運算
7.3.1 距離
7.3.2 長度
7.3.3 面積
7.4 空間查詢
7.4.1 包含（Contain）
7.4.2 重疊（Within）
7.4.3 交集（Intersect）
7.5 常見錯誤
7.5.1 頭尾不相連
7.5.2 方向錯誤

Chapter08 進階視覺化功能
8.1 群聚
8.1.1 亂數產生點
8.1.2 群聚（Leaflet MarkerCluster）
8.1.3 客製化 Icon
8.1.4 事件
8.1.5 群聚蜘蛛網
8.2 熱區
8.2.1 熱區（heatmap.js）
8.2.2 熱區圖設定及滑鼠事件
8.2.3 熱區地圖（leaflet-heatmap.js）
8.3 讓 Marker 動起來
8.3.1 會跳動的Marker（bouncemarker）
8.3.2 會移動的Marker（MovingMarker）

作者介紹

---

廖炳閎 Perry Liao

畢業於台大地理系，現於知名球鞋電商 AREA 02 擔任前端工程師，擁有近四年軟體工程開發經驗。熟悉多家WebGIS地圖服務開發，並擅長結合JQuery、React 等前端框架。

2018年至今，曾參與過十多個WebGIS的系統規劃及程式開發，並於2020年iT邦第12屆鐵人賽以《你的地圖會說話？WebGIS與JavaScript的情感交織》系列文章榮獲佳作。

---