以Drupal整合多元網路地圖服務之網誌發布平台

全文

(1)國立臺灣師範大學地理學系第四十三屆碩士論文. 以 Drupal 整合多元網路地圖服務之網誌發布平台. 研究生：劉婕昕指導教授：王聖鐸. 中華民國 103 年 6 月.

(2) 摘要在網路技術的發展與普及之下，使用網路地圖服務變得極為便利，各種適地性服務(Location-based Service, LBS)也應運而生。臺灣的應用程式開發商或一般使用者，多半採用 Google 公司所提供的 Google Maps，而北美的專案開發商則習慣採用 Microsoft 公司所提供的 Bing Maps。另一種網路地圖服務則是以協同製圖(Collaborative Mapping)為概念，結合眾人之力共同打造 Wiki-style 的開放街圖(OpenStreetMap, OSM)。除了商業公司與群眾繪製的消費級地圖，政府也因應開放資料的潮流提供部分專業級地圖，如：內政部國土測繪中心即整合所轄多元圖資，依循 OGC(Open Geospatial Consortium) 的 WMS(Web Map Service) 及 WMTS(Web Map Tile Service)標準，透過網路發布高精度的專業級圖資。然而一般使用者對於這些圖資較為陌生，對網路地圖的服務標準亦不熟悉，因此本研究透過 Drupal 內容管理系統(Content Management System, CMS)的 OpenLayers 模組介接專業級圖資，同時搭配內部已含的消費級圖資，以增加模組圖資的豐富程度。並根據使用者以往使用網誌的經驗，透過新增文章的方式使用多元圖資，不需要去了解各個圖資身在何方，即可直接透過選單的方式選擇使用。同時擴充點、線、面繪製及多媒體上傳功能，以突破一般網誌服務僅提供點位標註的限制。使用者在同一網站即可依自身需求、區域特性、主題目標，自由選擇最適合的圖資。且無論使用者是否具備地圖知識，也不論其空間資訊技術程度，皆能毫無差別地使用此地圖整合平台，快速建立含有地圖的主題頁面。為瞭解各項圖資精度與豐富程度，本研究使用測繪中心提供之 e-GNSS 雙星系統，現場測定點位座標作為基準，分別比較同一點位在通用版正射影像、Bing 衛星影像、Google 衛星影像、UAV 正射影像以及行動裝置所記錄之座標。由座標較差呈現出使用多元圖資來源所能達到之精度，並依據各圖資在不同區域之圖資豐富程度進行比較。. I.

(3) 本研究透過使用者實際測試及問卷調查，為所設計之地圖整合平台進行使用性分析。根據實際任務操作後的問卷統計結果，在控制各項網路服務的使用經驗變數下，單獨針對網路地圖技術能力背景進行分析。結果發現使用者網路地圖技術能力對於任務完成總時數的影響無顯著差異，即使不具備完整地理技術亦可操作此平台，與本研究所設計的平台易用性目標相符。在意見回饋的部分，相同項目下使用者的意見正負皆有，分析結果發現地圖整合平台有分眾瀏覽的需求。在平台應用層面的部分，平台的地圖功能足以應用在地理資訊的教學上及實察後地理資料的彙整。並建議平台後續發展橫向連結，例如：共同編輯與好友功能，有助於使用者回流使用。關鍵字：網路地圖服務、內容管理系統、國土測繪圖資、Drupal、OpenLayers. II.

(4) Abstract With the rapid development and popularization of Internet technologies, the utilization of web map service (WMS) becomes more and more convenient. Web maps are widely used or mashup as location-based service (LBS) in versatile applications. Most application developers and map users in Taiwan use Google Maps, while others in North America tend to use Microsoft Bing Maps. Based on the collaborative mapping concept, OpenStreetMap (OSM) is a different kind of web map service from above. But both kinds of map are classified as consumer-level maps. The National Land Survey Center (NLSC) provides a number of high-accuracy maps through OGC (Open Geospatial Consortium) WMS and WMTS standards. This makes professional-level maps available to the common users. Although WMS and WMTS provide a way to integrate maps into one’s web, it is still difficult for common users who are not familiar with computer language. In this study, a content management system (CMS) called Drupal is introduced to integrate both the consumer-level and professional-level map services by its OpenLayers module. Users now can simply select most suitable map while adding article to their blog, without knowing any computer language or cartographic knowledge.. This study also put its emphasis on the accuracy and richness of the versatile data sources. Several points are selected and positioned by the e-GNSS system. Their coordinates are also measured on the NLSC general ortho images, Bing satellite images, Google satellite images, UAV ortho images. The comparison of the coordinates between e-GNSS and each data source can be taken as an index of the mapping accuracy. In spite of the accuracy, the richness of each data source is also evaluated in this study.. User testing and surveys are executed in order to understand the usability of the map integration platform. The results of the usability questionnaires show no difference on users’ background. The users’ feedback in the design of the platform are divergent.. III.

(5) It is necessary to categorize users into several groups at the portal so the platform can provide different views and functions. There is also a high demand in providing social connection function, so they can co-edit or share the map article with their friends.. Keywords: Web Map Service (WMS), Content Management System (CMS), National Land Survey Center (NLSC) Maps, Drupal, OpenLayers. IV.

(6) 目錄頁數摘要 ............................................................................................................................... I Abstract ..................................................................................................................... III 目錄 .............................................................................................................................. V 圖目錄 ..................................................................................................................... VIII 表目錄 ..................................................................................................................... XIII. 第 1 章緒論 ................................................................................................................. 1 §1.1 研究動機與目的............................................................................................... 1 §1.2 文獻回顧........................................................................................................... 7 §1.2.1 網路製圖(Web Mapping)的技術與應用 .................................................. 7 §1.2.2 內容管理系統應用於地理資訊................................................................ 8 §1.2.3 OpenLayers ............................................................................................... 13 §1.2.4 網路地圖服務系統架設評估.................................................................. 14 §1.3 研究方法與流程............................................................................................. 16 §1.4 論文架構......................................................................................................... 21 第 2 章 Web Mapping 2.0 ......................................................................................... 22 §2.1 Web x.0 ............................................................................................................ 22 §2.1.1 網際網路的發展...................................................................................... 23 §2.1.2 Web 1.0 ..................................................................................................... 24 §2.1.3 Web 2.0 ..................................................................................................... 25 §2.1.4 Web 1.0 與 Web 2.0 網路地圖比較 ....................................................... 26 §2.2 Web Mapping ................................................................................................... 27 §2.2.1 網路地圖.................................................................................................. 28 §2.2.2 Web Mapping 的發展 ............................................................................... 33 §2.2.3 Web Mapping 的架構 ............................................................................... 42 §2.2.4 網路地圖服務種類.................................................................................. 45 §2.3 混搭(Mashup) ................................................................................................. 46. V.

(7) §2.4 群眾外包(Crowdsourcing) ............................................................................. 47 §2.5 小結................................................................................................................. 49 第 3 章網路地圖工具與實作 ................................................................................... 50 §3.1 網路地圖工具比較......................................................................................... 50 §3.2 網誌服務之地圖功能比較............................................................................. 57 §3.3 國土測繪圖資服務簡介................................................................................. 67 §3.4 多元圖資比較................................................................................................. 68 §3.4.1 精度比較實驗設計.................................................................................. 71 §3.4.2 實驗結果.................................................................................................. 74 §3.4.3 圖資豐富程度比較.................................................................................. 78 第 4 章地圖整合平台設計與建置 ........................................................................... 80 §4.1 平台功能分析................................................................................................. 80 §4.2 內容管理系統................................................................................................. 85 §4.2.1 Drupal Module .......................................................................................... 85 §4.2.2 安裝 OpenLayers 模組 ............................................................................ 86 §4.2.3 模組圖資整合.......................................................................................... 88 §4.3 建置成果與操作流程設計............................................................................. 93 §4.3.1 地圖整合平台建置.................................................................................. 93 §4.3.2 地圖整合平台建置成果.......................................................................... 96 §4.3.3 應用層面................................................................................................ 100 第 5 章地圖整合平台使用性分析 ......................................................................... 107 §5.1 任務設計與平台施測................................................................................... 107 §5.1.1 任務設計................................................................................................ 107 §5.1.2 施測方式................................................................................................ 108 §5.2 使用者背景能力分析................................................................................... 110 §5.2.1 使用者背景資料.................................................................................... 110 §5.2.2 平台任務操作分析................................................................................ 115 §5.3 平台使用性評估........................................................................................... 121 §5.3.1 任務計時量化分析................................................................................ 121 §5.3.2 使用者主觀使用性量表分析................................................................ 127 §5.4 平台滿意度評估........................................................................................... 131 §5.5 意見回饋....................................................................................................... 132. VI.

(8) 第 6 章結論與建議 ................................................................................................. 137 §6.1 結論............................................................................................................... 137 §6.2 後續研究建議............................................................................................... 139 參考文獻 ................................................................................................................... 140 附錄一：Categorization of web-mapping applications and services (Athan, 2007) ................................................................................................................................... 145 附錄二：地圖整合平台使用性分析問卷 ............................................................... 149 附錄三：問卷分析摘要 ........................................................................................... 153 附錄四：地圖整合平台操作手冊及影片連結 ....................................................... 162 謝辭 ........................................................................................................................... 163. VII.

(9) 圖目錄圖 1-1. 網路地圖服務架構圖.................................................................................. 17. 圖 1-2. 修改後的網路地圖服務架構圖.................................................................. 17. 圖 1-3. 南投桃米社區 GOOGLE MAPS ..................................................................... 18. 圖 1-4. 南投桃米社區 OPENSTREETMAP ................................................................ 18. 圖 1-5. 研究流程圖.................................................................................................. 20. 圖 2-1. WORLD WIDE WEB 發展軌跡圖 ................................................................. 22. 圖 2-2. 維基百科文章顯示在 LYNX........................................................................ 23. 圖 2-3. NCSA MOSAIC 1.0 ....................................................................................... 23. 圖 2-4. WEB 1.0 時期的地圖：臺灣原住民互動式地圖網 ................................... 24. 圖 2-5. WEB 2.0 時期的地圖：FLICKR 的像片地圖 .............................................. 25. 圖 2-6. GOOGLE MAPS ENGINE LITE 的簡易分析工具 ............................................ 28. 圖 2-7. GOOGLE MAPS 路徑規劃 ............................................................................. 31. 圖 2-8. 新北樂圾車－垃圾清運資訊查詢網.......................................................... 32. 圖 2-9. 都市計畫土地使用分區圖.......................................................................... 32. 圖 2-10 WIKIPEDIA 的知識條目可以具備地理座標 ............................................... 33 圖 2-11 透過 CGI 地圖和使用者間的互動 ............................................................. 36 圖 2-12 世界上最早的 WEB MAPPING 應用：XEROX PARC MAP VIEWER ............ 37 圖 2-13 WEB MAPPING 架構案例 ............................................................................. 44 圖 2-14 前 10 名被用來混搭的 API ........................................................................ 46 圖 2-15 前 10 名被用來混搭的 API ........................................................................ 47 圖 2-16 目前在 USHAHIDI 平台上創建的 CROWDMAP ............................................ 48 圖 2-17 江河觀察－公眾協作互動型水環境資訊平台.......................................... 48 圖 3-1. GOOGLE MAPS API V3 實作示意圖 ............................................................ 52. 圖 3-2. GOOGLE MAPS API V3 實作結果 ................................................................ 53. VIII.

(10) 圖 3-3. 地址輸入的地圖內容類型.......................................................................... 53. 圖 3-4. 新增地圖文章的地址欄位.......................................................................... 54. 圖 3-5. LEAFLET MODULE 實作成果 ....................................................................... 54. 圖 3-6. 地圖點選的地圖內容類型.......................................................................... 55. 圖 3-7. 新增地圖文章的地圖點選欄位.................................................................. 55. 圖 3-8. OPENLAYERS MODULE 實作成果 ................................................................ 56. 圖 3-9. BLOGGER 編輯文章位置資訊示意圖 ......................................................... 58. 圖 3-10 BLOGGER 文章中位置資訊實作截圖 ......................................................... 58 圖 3-11 WEEBLY 編輯文章地圖示意圖 ................................................................... 59 圖 3-12 WEEBLY 文章中地圖實作截圖 ................................................................... 59 圖 3-13 XUITE 文章中插入地圖的方式 ................................................................... 60 圖 3-14 XUITE 新增地圖位置的方式 ....................................................................... 60 圖 3-15 XUITE 可用拖拉調整地圖大小 ................................................................... 61 圖 3-16 XUITE 發布文章後顯示之地圖變為 HERE MAP .......................................... 61 圖 3-17. YAM 天空部落新增文章中地圖示意圖 ...................................................... 62. 圖 3-18. YAM 天空部落文章中地圖實作 .................................................................. 62. 圖 3-19 桃園八德埤塘生態公園點位眾多且誤植為台北市.................................. 63 圖 3-20 FACEBOOK 採用未中文化之 BING MAP ...................................................... 63 圖 3-21 FOURSQUARE 地圖採用 OPENSTREETMAP .................................................. 64 圖 3-22 GOOGLE SITES 可插入 GOOGLE 提供之服務包含地圖 .............................. 64 圖 3-23 GOOGLE SITES 中新增地圖點位的方式 ..................................................... 65 圖 3-24 GOOGLE SITES 新增地圖時可自訂的項目 ................................................. 65 圖 3-25 GOOGLE SITES 地圖實作結果 ..................................................................... 66 圖 3-26 國土測繪網路地圖服務系統提供之通用版正射影像.............................. 69 圖 3-27 本研究採用 UAV 載具：SENSEFLY EBEE .................................................. 70 圖 3-28 SENSEFLY EBEE 航拍國立臺灣師範大學林口校區正射成果 .................... 71. IX.

(11) 圖 3-29 研究區範圍與選擇點位（A1-A11）......................................................... 72 圖 3-30 TOPCON HIPER SR 衛星接收儀及控制器 ................................................... 73 圖 3-31 實驗流程圖.................................................................................................. 74 圖 3-32 各圖資與 VBS-RTK 量測數據之較差最大值與最小值 ........................... 75 圖 3-33 通用版正射影像較差直方圖...................................................................... 76 圖 3-34 BING 遙測影像較差直方圖 ........................................................................ 76 圖 3-35 GOOGLE 遙測影像較差直方圖 ................................................................... 76 圖 3-36 UAV 小區域航拍影像較差直方圖 ............................................................ 76 圖 3-37 行動裝置定位較差直方圖.......................................................................... 76 圖 3-38 GOOGLE SATELLITE ...................................................................................... 79 圖 3-39 通用版正射影像.......................................................................................... 79 圖 3-40 OPENSTREETMAP ......................................................................................... 79 圖 3-41 GOOGLE MAPS .............................................................................................. 79 圖 3-42 通用版電子地圖.......................................................................................... 79 圖 4-1. 地圖整合使用平台 - 使用者端概念圖 ................................................... 80. 圖 4-2. 地圖使用平台架構圖.................................................................................. 81. 圖 4-3. 新增地圖文章介面概念圖.......................................................................... 83. 圖 4-4. 使用者個人專頁概念圖.............................................................................. 84. 圖 4-5. DRUPAL 架設地圖網站概念圖 .................................................................... 86. 圖 4-6. DRUPAL 的 OPENLAYES 模組架構圖 ........................................................... 87. 圖 4-7. DRUPAL 的 OPENLAYES 模組中納入通用版正射影像 ............................... 89. 圖 4-8. DRUPAL 的 OPENLAYES 模組的預設圖層已包含新增圖資 ....................... 90. 圖 4-9. DRUPAL 的 OPENLAYES 架站者選擇圖資之表單 ....................................... 90. 圖 4-10 點選圖資表單即可使用專業級圖資.......................................................... 91 圖 4-11 以 DRUPAL 的 OPENLAYES 模組搭配 GEOPHP 及 GEOFIELD 收集地理資料 . ...................................................................................................................... 91. X.

(12) 圖 4-12 地圖整合平台架設流程圖.......................................................................... 95 圖 4-13 MAPINTEGRATION 便利的地圖使用平台建置成果 .................................... 96 圖 4-14 個人專頁範例.............................................................................................. 97 圖 4-15 使用者帳戶編輯頁...................................................................................... 98 圖 4-16 新增地圖文章畫面截圖.............................................................................. 99 圖 4-17 地圖文章發布成果截圖............................................................................ 100 圖 4-18 透過讀取智慧型手機所在位置發布地圖文章截圖................................ 104 圖 4-19 地圖整合平台專業領域應用於考古實察................................................ 105 圖 4-20 地圖整合平台一般生活製圖紀錄............................................................ 106 圖 5-1. 網路地圖使用平台完整個人專頁元素範例............................................ 107. 圖 5-2. 使用者測試任務設計步驟........................................................................ 108. 圖 5-3. 測試前問卷說明........................................................................................ 109. 圖 5-4. 使用者專業領域或工作領域圓餅圖（單位：人）................................ 110. 圖 5-5. 受試者使用過的網路地圖服務圓餅圖（單位：人）............................ 112. 圖 5-6. 受試者將網路地圖使用在專業領域的方式（單位：人）.................... 112. 圖 5-7. 受試者將網路地圖使用在日常生活的方式（單位：人）.................... 113. 圖 5-8. 受試者使用過的社群網路、網誌服務圓餅圖（單位：人）................ 114. 圖 5-9. 任務四操作方法示意圖............................................................................ 123. 圖 5-10 任務四操作成果示意圖............................................................................ 124 圖 5-11 任務五操作方法示意圖............................................................................ 125 圖 5-12 任務五操作成果示意圖............................................................................ 126 圖 5-13 註冊會員滿意圖長條圖............................................................................ 129 圖 5-14 編輯個人帳戶滿意圖長條圖.................................................................... 129 圖 5-15 新增地圖文章滿意度長條圖.................................................................... 130 圖 5-16 網路地圖種類滿意度長條圖.................................................................... 130 圖 5-17 專業級圖資的推廣應用滿意度長條圖.................................................... 130. XI.

(13) 圖 5-18 多元圖資觸及程度提升滿意度長條圖.................................................... 130 圖 5-19 圖資使用效率滿意度長條圖.................................................................... 130 圖 5-20 地圖使用便利性滿意度長條圖................................................................ 130 圖 5-21 網路地圖功能滿意度長條圖.................................................................... 130 圖 5-22 平台有效性滿意度長條圖........................................................................ 130 圖 5-23 系統使用性量表長條圖............................................................................ 132 圖 5-24 地圖整合平台使用者意見回饋分類圓餅圖............................................ 132. XII.

(14) 表目錄表 1-1. 網路地圖服務比較表.................................................................................... 2. 表 1-2. 國土測繪圖資網路地圖服務系統提供的 API 服務 ................................... 4. 表 1-3. 開發地圖服務技術門檻比較表.................................................................... 5. 表 1-4. 建置國家重要濕地資料庫入口網站系統軟體.......................................... 10. 表 1-5. 各項網路地圖服務案例使用的工具比較表.............................................. 12. 表 2-1. WEB 1.0 與 WEB 2.0 網路地圖服務比較表 .............................................. 26. 表 2-2. 網路地圖與網路製圖的發展年表.............................................................. 37. 表 3-1. GOOGLE MAPS API、LEAFLET MODULE、OPENLAYERS MODULE 比較表 50. 表 3-2. 線上網誌服務之地圖功能比較表.............................................................. 57. 表 3-3. 各圖資與 VBS-RTK 量測數據之較差統計表 ........................................... 75. 表 4-1. 網站內容類型規劃表.................................................................................. 82. 表 4-2. OPENLAYERS 模組預設的地圖圖層 ........................................................... 88. 表 4-3. 地圖功能主要使用模組.............................................................................. 94. 表 4-4. 普通高級中學必修科目「地理」課程綱要──地理資訊.................... 102. 表 5-1. 問卷來源與可用問卷數統計.................................................................... 109. 表 5-2. 網路地圖使用經驗描述性統計（N＝52） ............................................. 111. 表 5-3. 社群網路、網誌服務使用經驗描述性統計（N＝52） ......................... 113. 表 5-4. 網路地圖技術能力描述性統計（N＝52） ............................................. 115. 表 5-5. 網路地圖技術能力評分對應表................................................................ 118. 表 5-6. 任務完成時數與未完成者對應時數表.................................................... 119. 表 5-7. 共變數分析結果摘要表............................................................................ 120. 表 5-8. 任務計時量化分析平均數、標準差以及完成率.................................... 122. 表 5-9. 使用者主觀使用性量表描述性統計表.................................................... 129. XIII.

(15) 第1章緒論 §1.1研究動機與目的地圖的發展由「手繪」到「光學機械」乃至「攝影化學」階段的硬拷貝(Hardcopy) 圖，發展到「電子」階段的軟拷貝(Softcopy)圖。而在資通技術蓬勃發展下，網路益發普及、頻寬不斷提升，透過網際網路傳輸數位地圖已成為一般消費者擷取地理資訊的主要管道。 Google 公司所提供的 Google Map 以及 Microsoft 公司所提供的 Bing Map 都是由大公司投入大筆資金進行測繪，免費開放一般消費者使用。其著眼點在於大量點閱率所帶來的廣告收益，以及消費行為與趨勢分析。由於 Google 與 Microsoft 的產品定位不同，在臺灣地區的圖資詳盡程度也不同，因此臺灣的應用程式開發商與一般使用者主要採用 Google Map 地圖服務，而美加地區的政府單位或大企業則傾向使用 Bing Map。近年來在歐洲則是興起以協同製圖(Collaborative Mapping) 的概念發展出維基形式 (Wiki-style) 的開放街圖 (OpenStreetMap, OSM)(李昕迪等，2012)。這些網路地圖的訴求在於簡便易用而不講求精度，一般歸類為「消費等級地圖」。此外，臺灣在空間資訊基礎建設(Spatial Data Infrastructure, SDI)的規劃下，由內政部國土測繪中心建置一套專業等級的國土測繪圖資網路地圖服務系統 1，所提供圖資均經過品質檢驗，符合測量級精度之要求。此系統的內容整合正射影像、通用版電子地圖、國土利用調查成果圖、交通部運輸研究所路網數值圖、都市計畫土地使用分區圖、非都市土地使用分區圖等核心基礎圖資。相較於前述「消費等級地圖」，本研究將此類依照嚴謹測量規範所測繪之地圖歸類為「專業等級. 1. 國土測繪圖資網路地圖服務（101 年 12 月 7 日上線）：http://maps.nlsc.gov.tw/ 1.

(16) 地圖」。因此臺灣可使用的網路地圖豐富且多元，而這些地圖也隨著製圖方式、製圖者、製圖的規範而有不同的特質，茲整理如表 1-1。表 1-1. 網路地圖服務比較表消費級. 網路地圖服務產製方式. Google Maps Top-down 1.勤崴科技提供. 向量圖資. 影像圖資. OpenStreetMap (with Bing Satellite) Bottom-up 1.圖客影像數化 2.圖客上傳 GPS 紀錄之軌跡並編修. 國土測繪圖資網路地圖服務系統 2 Top-down 1.運研所路網數值圖 2.測繪中心 1/5000 基本地形圖 3.測繪中心通用版電子地圖. 1.DigitalGlobe 衛星 1.DigitalGlobe 衛星 1.通用版電子地圖影像影像 2.航測正射影像 2.群立科技航測影像 1.大眾運輸 2.路況 3.地形. 1.Transport Map 2.Cycle Maps. 特殊圖層. 2. 專業級. 國土測繪圖資網路地圖服務圖層確認日期：103 年 6 月 22 日。 2. 1.歷史正射影像 2.都市與非都市土地使用分區 2.門牌號碼 3.段籍圖 4.村里界圖 5.國家公園及風景區 6.避難收容所 7.工業區 8.土石流潛勢溪流圖 9.國土利用調查成果圖.

(17) 10.地籍圖 11.野生動物保護區及棲息環境 12.飲用水水源水質保護區 13.垃圾衛生掩埋場 14.高速公路參考里程. 優點. 缺點. 1.都市地區更新快 2.一致的處理原則 3.可使用之相關應用與產品較豐富. 1.POI 豐富多元 2.更新快、具即時性 3.道路屬性標籤豐富且劃分層級多。 4.符合地區需求 5.開源地理資料. 1.精度高，符合測量規範 2.定時分區更新 3.地理語意有一定標準. 1.影像幾何校正程度不一致 2.影像部分區域受雲遮蔽 3.道路僅有簡單等級畫分. 1.地理語意可能模糊 2.版本變動大 3.臺灣除城市地區外，許多地區目前尚不完整 4.需要大量且自發之圖客 5.雖有社群維護與共同討論，但製圖者素質不一，且對於屬性的詮釋各有主觀意識. 1.有浮水印 2.影像遇密圖遭馬賽克處理 3.更新速度較不具即時性. 承上所述，儘管臺灣擁有且可使用的圖資類型豐富多元，但各種類型的圖資都有其面臨的優、缺點。然而臺灣使用者所能聯想並使用的地圖以 Google Maps 為主，面對不同地區、生活議題及專業領域時，使用者甚至並不知道其他類型圖資的存在。若 Google Maps 在非都市地區不齊全、衛星影像有雲蔽時，如何讓使用者依其自身需求，簡單快速且有效地搭配運用多元圖資，便是本研究急欲解決的問題。. 3.

(18) 在使用網路地圖的方式上，Google Map 提供了應用程式介面(Application Programming Interface, API)讓使用者可以在自己的網站中加入 Google 所提供的網路地圖服務(Web Mapping Service, WMS)，然而使用者仍需要具備程式設計能力，且地圖來源也僅有 Google 一種。缺乏網路程式設計經驗之一般使用者，只能以畫面擷圖或透過分享超連結(Hyperlink)的方式分享網際網路地圖，缺乏有效擷取、分析、呈現、分享地理資訊之彈性。欲應用各種網路地圖服務必須有先備條件，使用 API 開發地圖網站及行動裝置應用程式都必須具備如：JAVA Script 等網路程式語言能力，不同的網路地圖服務提供的 API 服務也會有所不同。相關領域之專業人士或許能夠輕易達到此門檻，但一般使用者只能望圖資興嘆。目前，Google Map 和 OpenStreetMap 提供的 API 功能都十分完善，但由於 Google Map 在臺灣的地圖完整度比 OpenStreetMap 佳，因此，臺灣的網頁開發與應用程式開發者多以 Google Map 為獲取網路地圖服務的管道。國土測繪圖資網路地圖服務系統目前提供的圖資種類眾多，且包含許多特殊的在地化圖層。然而其提供的 Web Map API 服務僅有兩項，茲整理如表 1-2 (內政部國土測繪中心，2012)。由於一般使用者的地理資訊技術能力有限，儘管提供了多元圖資，但仍未見廣泛應用在學術研究、生活應用以致於其他層面，以致未能完全發揮專業級圖資本身的附加價值。表 1-2. 國土測繪圖資網路地圖服務系統提供的 API 服務. 國土測繪圖資網路地圖服務系統 Web Map API 一般使用者. 網頁內嵌入靜態地圖。透過在系統中框選範圍及新增地標，產生之 URL 即可加入網頁或 E-mail 中。. 專業使用者. 網頁內嵌入動態地圖。透過在系統中點選位置及新增地標，產生之 URL 插入網頁程式中，即能建置具備放大縮小等操作功能之動態地圖元件。. 內容管理系統(Content Management System, CMS)是一種網站系統建置的工具，架設者可以根據網站所需的功能來建構所規劃的網站架構與內容。Drupal 即 4.

(19) 是一種內容管理系統，透過核心(Core)模組與附加模組(Module)的搭載，建構符合需求的網站（鄭美如等，2012）。由於模組的客製化程度很高，因此可避免大量編寫程式碼或手動修改程式碼，與透過 API 開發地圖相關服務的門檻相較，透過內容管理系統架站的技術上門檻相對較低，茲整理如表 1-3。表 1-3. 開發地圖服務技術門檻比較表. Map API 主要使用之網路程式語言. OpenLayers. JavaScript（前端） JavaScript（前端）. CMS PHP（後端）、各 CMS 函式庫. 編修程式碼. 是. 是. 否（可）. 模組搭配. 否. 否. 是. 技術門檻. 需具備網頁前台開發之程式語言能力. 需具備網頁前台開發之程式語言能力. 模組關係繁複，需了解模組搭載關係. 國土測繪圖資網路地圖服務系統採用 OSGeo(Open Source Geospatial Foundation)所提供的 OpenLayers 程式庫所開發而成。OpenLayers 是建立地圖及地理空間資訊的開放源碼(Open Source)程式語言，其建立地理空間資料的方法符合 OpenGIS 的規範標準，可透過遠端服務方式將地圖資料載入瀏覽器中(林佳樺， 2011)，在應用發展上已相當親民。 Drupal 的 OpenLayers 模組具備豐富的消費級網路地圖資源，可用來降低技術門檻並快速架設地圖網站。因此本研究嘗試透過 Drupal 能整合網路地圖服務並從多種來源呈現圖磚(map tiles)和標記(markers)的特性，使其 OpenLayers 模組能整合臺灣公部門自產之專業級圖資，以增加模組圖資的豐富程度。本研究並透過實際測試及問卷調查，釐清網路地圖使用者的需求，瞭解 Drupal 是否確實能簡化架設地圖網站與相關應用之流程。提升一般使用者及各種程式供應者對於專業級地圖的可及性，以追尋一個簡單架設地圖網站，但卻具備更豐富圖資的 All in One 地圖模組為目的。. 5.

(20) 綜上所述，本研究希望達到的目的如下： . 多元圖資的整合平台：「位置資訊」已深植在各處，對於網路地圖的使用需求也逐漸增加，且網路地圖服務眾多，因此提供一個有效率地整合現有的網路地圖服務是本研究目的之一。本研究透過內容管理系統 – Drupal 的 OpenLayers 模組介接專業級圖資，同時搭配內部已含的消費級圖資，增加模組圖資的豐富程度，整合多元網路地圖服務。. . 使用者友善的圖資使用平台：網路地圖整合後，平台必須讓使用者透過簡單的操作，運用網路地圖來分享自己的地理資料，甚至透過網路地圖來進行研究或議題討論等。本研究藉由 Drupal 架設一套地圖整合平台的網誌服務，使用者可以經由以往使用網誌的經驗，透過新增文章的方式使用多元圖資，不需要去了解各個圖資身在何方，即可直接透過選單的方式選擇使用，同時提升以往網誌服務僅提供點位標註的功能，本研究之平台將會提供更多元的資料格式上傳服務，例如行動裝置紀錄之 GPS 航跡也可透過網站上傳，並直接展繪在地圖中。. 6.

(21) §1.2 文獻回顧. §1.2.1 網路製圖(Web Mapping)的技術與應用網路製圖主要針對在全球資訊網上提供網路地圖服務的技術議題作為討論重點，其技術方式眾多，Athan(2007)將已知的 45 種技術工具根據相似功能進行分類，並選出各分類中較為穩定的開源免費技術工具作為類型參考 (type reference)，如附錄一，並依據網路地圖服務系統提供的典型四種服務類型作為各種技術工具的比較方式，其比較內容包含： 1. 以地圖作為線上教育的工具； 2. 使用者社群根據一組被定義過屬性的位置資訊，回饋自己的所在位置，網站系統管理員即會被提示此資訊； 3. 使用網站地圖展示其工作的文件； 4. 線上進行資料收集與檢索，並且使用網站伺服器的中央資料庫； Athan 將以上使用者常需的四項服務進行組合，提出了三個 Web Mapping 服務的選項，並進行功能、成本、風險與所需技術的可行性分析，其結論為開源軟體能夠有效降低開發網路地圖服務的成本，但在架設上有無法克服的問題，因此使用開源軟體有可能會產生技術上的問題。根據附錄一，Drupal 為具有空間感知(Spatially-aware)的內容管理系統，可將帶有地理標記的內容展示在地圖上，同時 Drupal 也是一個免費獲取的開源軟體，而在 Athan 的技術工具分類中，Drupal 在該分類屬於穩定性較佳的 Type Reference，因此在做為架設網路地圖服務的網路製圖工具上，是一項值得考慮的方案。網路製圖的技術具有許多可發揮在生活中的關鍵應用，其中包含：地址對位 (Address Matching)、路徑規劃(Routing)、即時地圖(Real-time Maps)、適地性服務 7.

(22) (Location Based Services)、都市和區域規劃(Urban and Regional Planning)、線上地圖集(Online Atlases)、數位學習(E-Learning)等(Neumann, 2008)。透過 Web Mapping 搭配多樣化的服務，將可以提供更不一樣的網路地圖服務平台，例如：游豐吉、王韋力(2007)透過 Web-GIS 直覺式的溝通介面，整合民宿位置資訊，並結合即時視訊串流(Streaming)及環場多媒體，將不同的數位資訊有系統地結合於單一平台。並以 1/5000 航空照片圖、道路圖、基本地標設施圖作為底圖，開發出「宜蘭遊憩生活網」 3，成就更多元資訊的網路地圖服務。同樣的概念應用在博物館的館藏檔案網站中，Stefanakis et al. (2008)將 Georgios Averof 戰艦的多媒體資料與 Web Mapping 作結合，展示此戰艦的時空移動。Papadaki et al. (2010)指出 Stefanakis 在後續計畫更使用 3D 點雲將此戰艦重現，透過歷史記載重建當時艦上船員的生活，戰艦甲板的空間數據會連結到影像資料庫，根據時間和空間的變化，可以在模擬在船上看到的影像景色。 Web Mapping 在應用上越趨生活化的結果，理應使得大眾在技術的獲取與習得上更加方便，因此，內容管理系統的出現能夠有效降低網路地圖服務的架設門檻，使得地圖服務的提供不再只侷限在技術人才手中。. §1.2.2內容管理系統應用於地理資訊內容管理系統是一種網路應用程式，透過資料庫以一種直接管理網站的方式來建立、編輯以及儲存 HTML 內容(Bergstedt, 2003)。因此使用者不需要透過網頁編輯器，也不需要撰寫程式碼，即可直接在網站的管理介面，針對需要修改的部分做編輯。對於內容管理系統來講，地理資料即是一種「內容」，目前在各領域隨處可得各式各樣豐富的地理資料，透過內容管理系統的協助，將這些地理資料進行加. 3. 宜蘭遊憩生活網：http://www.emap.fit.edu.tw/yilan_web/，103 年 6 月 23 日瀏覽已關站。 8.

(23) 值應用，進而產生豐富的地理資訊供大眾使用，目前將內容管理系統應用於地理資訊系統的建置，在各領域皆有所發展的案例。交通部運輸研究所(曾志煌等，2011)計畫改善及擴充公路養護資訊整合應用平台 4的功能，欲將此平台整合社群網路相關服務，打造以 WebGIS 為核心，結合地理資訊系統(GIS)、地圖及內容管理系統(CMS)、部落格系統(BLOG)、論壇系統(FORUM)、社交微網誌系統(COMMUNITY)等多樣化網路服務功能的開放式網路地圖服務平台；然而，此系統的內容管理系統與其他相關系統模組的搭配，皆由該計畫參與者自行設計、規劃與開發，並無透過其他開源軟體的結合與應用，除此之外，內容管理系統並不直接應用於管理地理資料上，但從此系統可以看出，單純提供地理資訊平台的網路地圖服務已逐漸轉向多元的網路地圖服務。在自然生態的應用上，內政部營建署城鄉發展分署的國家重要濕地資料庫入口網站 5將功能分成三大項，其中包含：國家重要濕地導覽和相關計畫資訊、空間資訊導覽，及濕地調查資料查詢，並將此三部分採用不同的開源軟體技術工具做搭配，其採用的工具如表 1-4 所示(王豫煌等，2010)。此系統僅在入口頁面的資訊導覽部分採用內容管理系統 Drupal 6.x 架設，空間資訊導覽系統與濕地調查資料查詢系統則是透過不同的開源軟體搭配，對於採用內容管理系統中提供的地圖服務功能著墨並不大，但是已經可以看出，內容管理系統與地理資訊結合的重要性逐漸攀升。. 4 5. 公路養護資訊整合應用平台：http://220.128.223.35/jecms/jecms.cms/ 國家重要濕地資料庫入口網站：http://wetland-tw.tcd.gov.tw/drupal/ 9.

(24) 表 1-4. 建置國家重要濕地資料庫入口網站系統軟體. 軟體名稱. 功能. 來源網址. 1. 入口網站管理系統 Drupal 6.x. 入口網站建置、管理系統. http://drupal.org/; http://drupaltaiwan.org/. MySQL. 網站資料庫管理系統. http://www.mysql.com/. Google Maps API. 網站內嵌 Google. http://code.google.com/intl/zhTW/apis/maps/. maps 應用程序網站內嵌 Google 自 Google Custom 訂搜尋應用程序 Search Engine API 2. 空間資訊導覽系統. http://code.google.com/intl/zhTW/apis/customsearch/. 網路地理資訊應用整合軟體. http://mapserver.org/;. GeoMOOSE 2.0. 網路地理資訊應用整合軟體. http://www.geomoose.org/. MSCompanion. MapServer map file 編輯軟體. http://code.google.com/p/mscom panion/. MapServer for Windows (MS4W). http://maptools.org/ms4w/. 3. 濕地調查研究資料查詢系統 Apache 2.x. 網頁伺服器軟體. http://httpd.apache.org/. TomCat 5.5. 網頁伺服器軟體. http://tomcat.apache.org/index.ht ml. OpenLDAP-2.4.16. 使用者登入認證系統. http://www.openldap.org/. phpldapadmin. 認證系統管理軟體. http://phpldapadmin.sourceforge. net/. PostgerSQL 8.3. 資料庫管理系統. http://www.postgresql.org/. MetaCat 1.8.1. 生態詮釋資料儲存、共享系統. http://knb.ecoinformatics.org/soft ware/metacat/. Morpho 1.6.1. 生態詮釋資料編輯軟體. http://knb.ecoinformatics.org/mor phoportal.jsp. 中央研究院人文社會科學研究中心地理資訊科學研究專題中心自 2009 年起規畫的文化資源地理資訊系統 6(Cultural Resources Geographic Information System, CRGIS)則是空間資訊技術應用於地方社會的實例，根據歷史文化與自然環境變遷，匯聚有形與無形的文化資源空間及屬性資料，同時也搭配歷史圖資與當代圖 6. 文化資源地理資訊系統：http://crgis.rchss.sinica.edu.tw/ 10.

(25) 資，讓此系統具有時空變化的特質存在。CRGIS 的資料庫是以 Web2.0 及資料共享為核心理念，是全國最完整的非政府官方文化資源資訊平台，內容包含相關政府單位提供的基礎資料外，地方團體及個人也可提供並維護在地的文化資源資訊，是一個公眾參與式地理資訊平台(Public Participate GIS, PPGIS)。而此系統的設計方式分為兩部分：地圖部分採用 Google Map API 搭配開源資料庫 PostrgeSQL，內容管理的平台部分則是採用開源的內容管理系統 Plone(范毅軍等，2010；廖泫銘，2010)。此系統的網路地圖服務提供文化資源的分布查詢、學術田野調查成果整合與匯出，及整合不同來源的資訊三大部分，雖然有 Web2.0 的核心理念，但一般使用者並無法即時更新地圖上的文化資源資訊，若能提供使用者更新功能，將更能提升 CRGIS 中地圖的即時性。 Papadaki et al. (2010)認為目前學校或大學在 GIS 教學上，最常見的方式是使用商業的桌上型 GIS，但這對於現今學生在使用教學素材、學生或是數位教育平台的需求、GIS 社群的需求、傳統的教學方式來講，並不具有彈性也不夠靈活，因此提出了 GIS 教學領域應改變教育方式。GIS 的視覺化和分析工具對於歷史教學有非常大的優勢，因為故事通常是具有時空維度(Spatial-temporal Dimension)，因此提出將歷史故事的數位說故事(Digital Storytelling)應用在 GIS 的教學上，提出了一套嶄新的地理資訊教育工具(GIS Educational Tool, GET)。一般的教學平台，如：Blackboard Web Client and Mobile, CLIX, Moodle 等，這些系統設定了一定的學習模式，並且都較不具有彈性，而大部分的 CMS 提供更具有彈性且動態的介面，對 GIS 教育目的是非常有幫助的，它能夠協助管理地理內容(GeoContent)及地理資料(Geographic Data)。因此，以 Joomla!搭配 GeoServer 及 GeoNetwork，採用 OpenLayers 函式庫設計使用者操作應用端，並搭配 PostGIS 作為儲存與檢索地理資料與地理內容的資料庫。運用此系統，教師可先將以歷史為主的教學素材分成各節上傳至內容管理系統，學生將會依據權限設定，被分配到不同的素材，學生必須透過此系統將素材給予時空的詮釋資料(Metadata)，完成後會有 GIS 的 11.

(26) 學習評量。柯皓仁等(2012)提供一個與社群生活較為關聯的案例，藉由 Web2.0 混搭的概念，將工業技術研究院資訊與通訊研究所的 iBike 團體定位移動系統、Google Map Service V3、Facebook Plugin 整合進 Drupal。將優人神鼓於 2012 年所發起的少年「安途生」行動學校計畫中，參與計畫之青少年的表演路徑、資訊及影音即時分享到具有地圖功能的網站中。並透過社群網路的功能，讓師生及民眾皆能一同體驗參與者的所見所聞。上述的各項案例研究，根據不同需求而採取不同的技術工具使用策略，如表 1-5 所示，各項案例主要都是使用內容管理系統作為網站的框架，搭配各自選擇的 Web Mapping 工具。雖然功能完善且豐富，但對於一般使用者欲自行架設網路地圖服務來講，會有諸多的技術問題。因此本研究嘗試以不搭配其他工具的情況下，完全以內容管理系統提供之 Web Mapping 工具做升級，讓使用者在架設網路地圖服務時能夠更加簡便。表 1-5 System Name. 各項網路地圖服務案例使用的工具比較表 CMS. Web Mapping Tool. Other Tools. 公路養護資訊整合應用平台. 自行開發. Google Maps API. PostgerSQL, PostGIS. 國家重要濕地資料庫入口網站. Drupal. Google Maps API, MapServer for Wondows, GeoMOOSE. PostgerSQL, OpenLDAP, MetaCat. 文化資源地理資訊系統. Plone. Google Map API. PostrgeSQL,. 數位說故事的地理教學工具. Joomla!. OpenLayers, GeoServer, GeoNetwork. PostGIS. 優人神鼓少年安途生計畫. Drupal. Google Map Service V3. iBike 團體定位移動系統 Facebook Plugin. 12.

(27) §1.2.3OpenLayers OpenLayers 是一個將動態地圖嵌入網站的物件導向 JavaScript API，可以將許多來源不同的地圖透過 OpenLayers 匯聚到網站上的地圖。使用此程式語言製作的地圖是具有互動性的，使用者可以放大、縮小地圖，也可以拖曳或調整地圖顯示的比例尺、勾選想要啟用觀看的圖層，也可以標記想要顯示的位置資訊或是編輯向量資料。OpenLayers 的優點之一是，它可以完全根據網站的架構客製化地圖，它也提供使用者自行定義工具和設定，同時也支援新的地圖圖資匯入 (Sauerwein, 2010)。 OSGeo 在開放 OpenLayers API 時，採用 WMS-C(Web Mapping Service – Tile Caching)規格，因此 OpenLayers 可以應用到以 WMS 發布之圖資(陳世儀等，2012)。此外，它也支援 XML, GML, GeoJSON, GeoRSS, JSON, KML, WFS, WKT(WellKnown Text)等格式(林佳樺，2011)，因此只要網路地圖服務是以上被支援的格式，即可透過 OpenLayers 連結在網站前台顯圖。陳世儀等(2012)針對 OpenLayers 的特性，設計一套不須 GIS 套裝軟體，直接使用 Web 伺服器搭配 OpenLayers API，提供自有圖資圖磚的網路地圖服務。該服務應用 OpenLayers API 的開放架構，加值其圖資並鞏固服務效能，使得網路地圖服務的架設少了一道 GIS 軟體的關卡，提供除了 GIS 套裝軟體與 Google 公司產品外，另一種網路地圖服務架設的選擇。除了 OpenLayers API 本身提供的功能外，Sauerwein(2010)在 OpenLayers 中使用 HTML5 的 Canvas 元素(element)， Canvas 是 HTML5 中透過 Script 來繪製圖形的元素，有數種方法可以繪製路徑、圓圈、方盒形以及加入圖片(W3Schools, 2013)。根據這個功能，Sauerwein 以 OpenLayers 作為網路地圖網站的底圖，嘗試使用 Canvas 在用戶端呈現向量圖層和網格圖層，雖無法取代目前使用的 SVG，但卻是另一種視覺化地理資訊的方式。 13.

(28) OpenLayers 對於圖資的匯入與工具的搭載，都有很大的彈性，只要符合規範的標準，在新增圖資內容與開發新工具上都有相對優勢，因此本研究採用 OpenLayers 模組整合多元圖資。. §1.2.4 網路地圖服務系統架設評估本研究的目標族群為網路地圖服務系統架設者及使用地圖功能的網站架設者，而前人研究主要是網路地圖的使用性評估，針對網路地圖服務架設工具使用性評估並不多。因此，針對內容管理系統架設的部分採取其他領域的架設經驗作為討論。內容管理系統在教育領域的部分應用非常廣泛，隨著資訊科技的普及，學校對資訊教育的重視，一般教師在資訊應用能力皆有提升，製作簡單的靜態網頁對教師來講是相當容易的，但新一代的網站經營理念必須包含低成本與互動式的兩個概念，為達到此二目的，主要的方式便是降低互動式網站架設的技術門檻(張俊明等，2004)，內容管理系統在互動式網站的架設上，能夠提供視覺化界面的操作，能夠有效降低技術門檻，達到節省成本的概念，因此，能夠成為在教育領域推廣的不二選擇。近年來，臺北市政府教育局透過「推動校園應用 Drupal 快速建置網站服務實施計畫」，藉由暑期教師研習的方式，培育各校應用 Drupal 的人才，期許此批人才能夠協助建構資訊服務平台，以及資訊融入教育的教學平台開發、維護及運作，同時，內容管理系統的操作普及化也能節省經費與降低人力成本(魏仲良等， 2012)。徐旭伸等(2012)也藉由內容管理系統 XOOPS 搭配網頁編輯器 Namo WebEditor 為國小學童架設創新能源教材學習網站。根據以上經驗，內容管理系統對於一般資訊科技背景的使用者來講，是能夠. 14.

(29) 透過短期研習課程而上手的，並不需要過度艱深的資訊科技技術，對於降低架設互動式網站的技術門檻，有明顯的助益。網站及系統的使用是否符合使用者的習慣，是該系統成功與否的關鍵，因此，針對網站評估，Usability.gov 提出網站的使用性(Usability)評估因子包含：有效 (Effectiveness)、效率(Efficiency)、滿意度(Satisfaction)、錯誤率(Error frequency and severity)、記憶性(Memorability)五項(Usability.gov, 2013)。評估網站使用性的方法分為兩項：專家導向評估與使用者導向評估(Genuis, 2004)。Newman et al.(2010)在開發公民科學(citizen science)的 Web Mapping 網站，針對大眾參與者進行網路地圖服務的使用性評估，評估使用者對網站的滿意度、效率、有效三項因子；由於此研究的使用者來自不同的生活背景、文化和不同的科技涉入程度，因此會影響其對網頁的認知和解釋，產生的反應和回饋也會不同。其評估方式採用使用者導向評估，根據定量和定性兩種方法分別設計評估方法：設計不同任務，並計算參與者在時間內的任務完成率與次數，以及透過問卷的方式來獲得使用者的態度與喜好，再進行系統的修正，系統上線後會持續收集網友的回饋來做系統修正，最終從網站開發與參與者經驗中習得改善網站的問題，並提供一套以公民參與科學為基礎的 web mapping 網站架設指引。儘管是針對網路地圖服務使用者進行測試，其評量的方法依舊可作為使用地圖功能的網站架設者的使用性評估，透過任務設計與口頭訪談，進而評量以內容管理系統進行網路地圖服務架設的適宜性，同時其提供的網站架設指引也可為網站架設者給予方向。. 15.

(30) §1.3 研究方法與流程本研究欲解決之問題主要有二：. 1.. 臺灣可使用的網路地圖服務類型豐富多元，包含消費級與專業級圖資，但使用者所能聯想並使用的地圖以 Google Maps 為主，若該地圖服務在使用上出現問題，使用者對於其他網路地圖服務不熟悉，則無法順利使用。. 2.. 網路地圖服務種類繁多且分散，但多數網路地圖服務的使用並不普及，儘管圖資優良，一般的使用者並無法得知該服務，因此如何將分散的多元網路地圖服務整合其中，是本研究欲解決的第二個問題。. 因此本研究採用開放源碼的內容管理系統 -- Drupal，除了本身具備的核心模組，它具有非常多的模組可以用來添加各種功能，使用者可以在不需要修改程式碼的情況下，依照自己的需求來設定網站的功能。此外，Drupal 有強大的社群做後盾，使用者遇到問題即可隨時上網尋求援助(Byron et al., 2012)。透過此一彈性的系統構造，可以將架設網路地圖服務的作業流程更加簡化，如圖 1-1，在使用內容管理系統前，使用者若要使用網路地圖服務，必須具備相關的技術能力，方可自行發布網路地圖或者取得其他方所發布的網路地圖；然後修改後的網路地圖服務架構，如圖 1-2，透過內容管理系統去介接其他來源的網路地圖服務，使用者不需了解網路地圖身在何方，而可以直覺的使用網路地圖，使得網路地圖服務的取得更為便利，提升使用地圖的架站者及一般使用網路地圖的用戶，在操作地圖時的意願與內容的豐富程度。. 16.

(31) 圖 1-1. 網路地圖服務架構圖. 圖 1-2. 修改後的網路地圖服務架構圖. 因此，本研究以內容管理系統 Drupal 為架設網路地圖服務之基礎工具，搭載其具備完整功能的 OpenLayers 模組，整合以國土測繪圖資為基礎的網路地圖平台。此一以內容管理系統建造之網路地圖整合平台應達成以下條件： . OpenLayers 模組需整合臺灣公部門自產之專業級圖資. . 簡化網路地圖服務架設之流程與時間. . 提升一般使用者對於專業級地圖的可及性. . 具備符合使用者所需之網路地圖整合平台之功能. . 建立符合使用者需求之網路地圖服務操作基本流程. 在網路地圖整合平台的設計方面，有別於一般網路上現行的服務以單一功能為主，如：帶我去旅行、TripAdvisor 等鎖定使用族群的主題性功能，且提供的地圖服務同樣為單一來源的 Google Maps，其實是不利於社區深度旅遊時使用。圖 1-3、圖 1-4 以南投桃米社區為例，社區營造的結果卻無法呈現在 Google Maps 上，由於旅遊網站多半採用 Google Maps，以致於以旅遊為需求所設計的地圖網站，卻不一定有辦法滿足旅遊的需求，因為使用者沒有其他圖資可供選擇。如果使用者除了 Google Maps 之外，還可以選擇 OpenStreetMap，就有機會看見不同的結果，選擇其合適的旅遊方式。. 17.

(32) 圖 1-3. 南投桃米社區 Google Maps. 圖 1-4. 南投桃米社區 OpenStreetMap. 因此，本研究之平台不預設主要使用族群、不預設主要使用目的，為各類使用者皆可操作為主的通用性平台。預期每個人無論其背景、來源或使用目的，將多種圖資集結在一個網站中，每個人都可以選擇使用多元圖資。在圖資使用上以使用者自身目的為主，一般使用者也能輕易使用專業級網路地圖服務，而不再侷限於少數專業的使用者。為達成上述條件，必須包含以下研究議題：. 1.. 如何增加並修正 Drupal 之 OpenLayers 模組的基本圖資. 2.. 如何增加並修正 Drupal 之 OpenLayers 模組提供的 Mapping 基本功能. 3.. 釐清並了解一般網路地圖服務使用者的需求. 4.. 完成 OpenLayers 模組在地化與 All in One 之要求. 5.. 建立符合一般使用者需求之網路地圖服務基本流程. 本研究之整合多元網路地圖服務的簡易架站系統流程如圖 1-5 所示。在執行本研究的過程中，有兩項最主要的操作工具必須被討論： . 內容管理系統－Drupal 7.x：本研究會將現有網路地圖服務搭配的功能做整理與分析，聚焦在「學術研究」與「教學平台」之網路地圖服務為主，分析此兩類族群使用者在使用網路地圖服務時必備需求的功能，透過內容管理系統的各項模組搭載，達成分析結果所需之功能，強調不需自行撰寫或修改程式碼，一切的過程皆使用 Drupal 社群提供之模組組 18.

(33) 合而成，並盡量簡化繁複的操作程序，能夠在最短的時間搭載出所需之網路地圖服務。 . 模組－OpenLayers Module：本研究強調除了現行使用之消費級電子地圖，欲發展 OpenLayers 模組的圖資豐富性，因此必須在模組內加入臺灣公部門自產之專業級圖資為基礎圖資，增加使用者在使用者對地圖的選擇性，同時能夠提升一般使用者對專業級圖資的可及性，讓這些專業級圖資有更多被加值使用的機會。. 19.

(34) 圖 1-5. 研究流程圖 20.

(35) §1.4 論文架構本論文可分為六個章節如下： . 第一章：闡述網路地圖平台開發的研究動機、可整合的網路地圖服務，而網路製圖為本研究的重點概念，因此針對相關研究、技術與平台的使用性評估進行主題進行文獻回顧。. . 第二章：根據網路製圖的演進，本研究朝向以 Web Mapping 2.0 作為理論基礎，並依據其組成概念與發展進行推演。. . 第三章：本研究根據現有常用網路地圖工具、線上網誌服務中地圖功能進行比較，以及欲整合之多元圖資比較，及國土測繪圖資網路地圖服務系統之圖資說明。. . 第四章：從現行的地圖工具與網誌服務中的地圖功能比較結果，進行地圖平台系統功能分析與設計、內容管理系統架設地圖網站流程、模組設計、修正與整合之操作流程。. . 第五章：透過使用性評估，將網路地圖平台架設成果及整個使用者操作流程進行實作測試，並根據施測結果及使用者回饋，分析平台可修正的面向。. . 第六章：本研究及網路地圖平台總體成效總結，以及平台後續研究與發展之建議。. 21.

(36) 第2章 Web Mapping 2.0 Web Mapping 2.0 是 GeoWeb 在新地理學(Neogeography)的展現，它包含社會群體和技術發展的討論。本質上來講，新地理學關注的網路製圖，在於人們依據自己已存的條件及工具，創造屬於他們自己的地圖，結合現有的工具元素，和朋友或訪客分享位置資訊，並根據自己的在地知識，形塑內容(context)和傳遞知識 (Turner, 2006)。網路和社群的出現，讓 GeoWeb 領域產生革新，從地理資訊內容的角度，地理資料和資訊不再只涵蓋地理學家的想法，轉而邁入與公眾相關的地理學；從技術角度來觀察，Web Mapping 2.0 時代的網路製圖與上一代網路製圖模式也產生差異(Haklay et al., 2008)。. §2.1 Web x.0 從 Web 1.0 到 Web2.0，網際網路的使用者經歷一種網路使用經驗上的觀念變革，無論是提供服務的方式或用戶使用網路的焦點皆產生了變化。2007 年網路創業者 Nova Spivack 根據觀察，繪製 World Wide Web 的發展軌跡(蕭景燈等， 2011)，如圖 2-1，根據此圖可以發現，網路使用模式的觀念不斷地在改變。. 圖 2-1. 7. World Wide Web 發展軌跡圖 7. 圖片來源：Radar Networks & Nova Spivack, 2007- https://www.radarnetworks.com 22.

(37) §2.1.1 網際網路的發展 Web Mapping 的發展仰賴於網路科技的出現與瀏覽器的發展。網際網路的起源來自於 Defense Advanced Projects Research Agency (DAPRA)所贊助的研究計畫，其目的為開發一種能夠抵禦外來攻擊，並且讓全美各地研究人員能夠互相分享資訊的網路技術。1969 年 9 月推出 ARPANET，將當時的 UCLA, Stanford Research Institute, UC Santa Barbara 及 University of Utah 連線。至 1972 年，該網路開發出電子郵件的功能，1973 年時又增加連線英國的 University College of London 和挪威的 Royal Radar Establishment，展開了網路國際化的旅途。1986 年，美國國家科學基金會(National Science Foundation)將其最大的網路 NSFnet 與 ARPANET 連線，Internet 因而出現。任職於 CERN(European Organization for Nuclear Research)的瑞士物理學家 Tim Berners-Lee 將電腦間的資訊相互連結，建立 ENQUIRE 系統，方便資料的交換，後來將此技術命名為 World Wide Web(WWW)。在 1993 年以前，瀏覽器只有文字介面，如 Lynx(圖 2-2)，Marc Andreessen 的團隊共同研發了圖形化介面的瀏覽器 Mosaic(圖 2-3)，而後則發展出 Netscape Navigator 瀏覽器，(Capron, 2008)瀏覽速度增加，圖形化介面的瀏覽器便逐漸有更多的發展。. 圖 2-2. 維基百科文章顯示在 Lynx 8. 圖 2-3. NCSA Mosaic 1.0 9. 圖片來源：Wikipedia [Lynx]- https://zh.wikipedia.org/wiki/File:Lynx-wikipedia.png 圖片來源：Wikipedia [Mosaic (web browser)]http://en.wikipedia.org/wiki/File:NCSAMosaic1.0Mac.png 8 9. 23.

(38) §2.1.2 Web 1.0 Web 1.0 的時代，網路的使用是一種「單向內容發布」的概念(馮德聰，2011)，關心「單向廣播式」的資訊傳遞，由少數的資訊提供者向多數的網路使用者發布資訊。網路頁面主要為靜態，文字為主、圖片為輔，主要提供的服務為網路化、超連結、多媒體、發布及下載，網路使用對於用戶的意義是資訊取得與便利生活 (曾元顯，2007)，此時期資訊結構的方式是由提供方主導的分類法(Taxonomy)，是一種由上而下的專門學科知識的分類。 Web 1.0 的網路地圖比較像是電子地圖的網路化，製圖者透過網路向使用地圖的群眾發布訊息，如圖 2-4 所示的「臺灣原住民互動式地圖網」。透過地圖呈現目前臺灣原住民的分布區域，以及原住民族的概況介紹。雖然名為「互動式」，但使用者僅能選擇所要了解的區域和族群，並無法為地圖增添資訊或編修內容。. 圖 2-4. 10. Web 1.0 時期的地圖：臺灣原住民互動式地圖網 10. 圖片來源：臺灣原住民互動式地圖網-http://web.ntnu.edu.tw/~497231230/swffinal.html 24.

(39) §2.1.3 Web 2.0 Web 2.0 的網路使用是一種「互動分享」的概念，關注「人際互動式」的關係處理，資訊透過雙向或多方互動而產生。此時期的網路行為是具有社交功能，並且能夠有更多個人化的設定(馮德聰，2011)，使用者可以建立個人頁面，並且在他人的頁面進行溝通，主要提供的服務開始增加上傳、互動、分享、訂閱、食衣住行娛樂、選舉(曾元顯，2007)，資訊結構的方式是依標籤、關鍵字分類的分眾分類(Folksonomy)，其為由下而上依群眾自行定義標籤分類，會依社經文化背景等諸多因素而有所差異。 Web 2.0 的網路地圖主要有兩種類型，第一種是地圖網站(mapping site)，使用者可以自行提供資料或整合其他服務加入地圖中，各種應用 Google Maps API 搭載的服務即是此種地圖的呈現；第二種則是具有空間資訊的非地圖網站(nonmapping site)，例如帶有座標位置標籤(Geotag)的像片，在 flickr 中可以把這些照片放入地圖，同時使用者也可以替輸入標籤(Tag)賦予照片索引，如圖 2-5 製作旅遊的回憶地圖(Haklay, 2008)。. 圖 2-5. Web 2.0 時期的地圖：Flickr 的像片地圖 25.

(40) §2.1.4 Web 1.0 與 Web 2.0 網路地圖比較 Web 1.0 與 Web 2.0 時期，網路地圖的差異比較如表 2-1。單就圖資層面來討論，Web 1.0 時的網路地圖服務在圖資的檢驗上，由於提供者為單向的發布地圖，因此在地圖的品質檢驗上能夠有標準查照，圖資更新區域亦有所規劃，但受限於此條件，圖資的更新速度較不即時，且興趣點較少；若使用網路地圖服務提供之 API，使用者可以自行添加圖層至這些單向發布的地圖上，增加了些許「使用者參與」的部分，但並無法改變圖資本身；然而在 Web 2.0 時期的網路地圖服務，地圖的提供者轉為每一個人，因此更新圖資具備即時性，只要一發現問題即可上傳修改，但也因此，即使不熟悉其編繪規範的圖客也可參與，且多數圖客會集中在部分地區，使得圖資完整程度不一，但由於編繪地圖的人同時亦為該地區的地圖使用者，更能熟悉當地的地理條件，因此能夠編繪出符合當地需求的地圖，也因為開源資料，可以增加許多更親近社區的地圖服務。表 2-1. Web 1.0 與 Web 2.0 網路地圖服務比較表 Web 1.0. Web 2.0. 網路地圖服務舉例. 國土測繪圖資網路地圖服務系統. Google Maps API. OpenStreetMap. 使用者參與. 使用網路地圖服務系統中提供的功能. 疊加自有圖層或加值服務，無法更動圖資內容. 可編輯圖資內容. 更新效率. 圖資定時劃區更新. 自有圖層更新快. 隨時更新具即時性. 圖資處理. 具規範、一致性高. 一致性高. 因圖客而異. 精確性. 符合測量精度檢驗. 都市地區較為精準. 因圖客而異. 影像品質. 符合測量精度檢驗. 處理程度不一有雲遮蔽現象. 影像糾正處理不佳. 地理資料. 可介接. 可介接. 開源資料. POI 地理語意. 較少. 普通. 豐富可自由新增. 具一定標準. 具一致性. 符合地方需求編繪. 應用產品. 較少. 最多. 次多. 26.

(41) §2.2 Web Mapping 網路製圖(Web Mapping)指的是在全球資訊網上設計、實施、生產及提供地圖的過程，主要強調技術議題。網際網路地圖學(Web Cartography)則是強調理論觀點的研究，例如：網際網路地圖的使用、技術和工作流程的評估和優化、社會觀點甚至更多議題。許多提供網際網路地圖服務的網站會自稱或被歸類為「網路地理資訊系統(Web GIS)」，但是地理資訊系統畢竟不應該只是地圖，還必須提供各種空間分析(Spatial Analysis)功能以協助決策支援(Decision-making Support)，而網際網路地圖通常只是網路地理資訊系統展示成果的方式之一。不過近來提供網際網路地圖服務的網站也逐漸增加分析功能，如 Google Maps Engine 精簡版就提供了數化、圖層、路線分析及距離量測等功能（圖 2-6）。行動網路地圖(Mobile Maps)則是一種特殊的網際網路地圖，專門設計給行動運算裝置使用，讓使用者可以透過如：智慧型手機、PDA、GPS 等裝置上的瀏覽器或特定 app 上網瀏覽地圖。如果地圖服務供應商不僅提供行動網路地圖，還基於使用者定位結果提供進一步資訊，例如：鄰近興趣點，則被稱適地性服務(Location Based Service, LBS)。使用網際網路作為地圖的傳播媒介被視為製圖學一項重要進展，並且開展了許多機會，例如：即時地圖、便宜的媒介、便宜的資料、快速的更新、個人化的地圖內容、分散式的資料來源、以及大量的地理資訊共享。然而隨著傳播及展示技術的改變，也為製圖學帶來更多挑戰，例如：如何將地圖正確展示在不同大小、解析度的螢幕、如何彈性調整地圖內容以適應不同的網路頻寬、如何在有效保障著作權的前提下兼顧共享，如何保障資訊的安全性、以及如何簡化複雜的技術等。網際網路地圖從 Web1.0 的靜態展示，到今天具備豐富的互動性，並且整合多種媒體，這代表的是 Web Mapping 和 Web Cartography 也必須解決互動性、使用性和多媒體的議題(Neumann, 2008)。. 27.

(42) 圖 2-6. Google Maps Engine Lite 的簡易分析工具. §2.2.1 網路地圖. §2.2.1.1 網路地圖的優勢與劣勢網路地圖相對於傳統紙圖，它可以較為便利地提供最新、最即時的資訊，例如：在地圖上即時呈現感測器監測到的交通狀況資料，使用者只要載入應用程式，便能即時更新資訊內容。此外，相較於紙圖的重製需要大量的人力與金錢，網路地圖的更新成本較低，網際網路地圖伺服器和網路製圖的開源軟體工具也越來越容易獲得，意味著更密集更新的可能性。基於開放標準所產製的網路地圖，並不會受到作業系統與瀏覽器的影響，具備跨平台的可用性。如同一般網頁，網路地圖也可以整合多媒體，並支援超連結，可作為資料連結的樞紐。只要投影坐標系統、地圖比例尺相同，並使用開放地理標準和適當 API 的搭配，網路地圖可以整合分散四處的資料來源，降低各單位重複維護相同資料集的負擔。但相對地，在使用外部資料時，必須先確認資料來源品質，否則一昧套疊將會導致使用者錯誤的判讀結果。網路地圖具備客製化的能力，使用者通常可以自行調整圖徵樣式或配色，這 28.

(43) 有利於特定人士的讀圖需求，如：色盲患者。網路地圖也實現了協同製圖 (Collaborative Mapping)的可能性，透過網際網路地圖技術的發展，地圖的產製不再侷限於權威的專業來源，一般民眾也可以參與製圖，如：開放街圖 (OpenStreetMap)。縱然優勢很多，網路地圖仍有許多問題有待解決：(1)網路和網站伺服器有可能因為停電或網路攻擊而無法存取；(2)外部資料來源有可能隨時變動連結位置，作者通常也不保證長久提供資料；(3)地圖資料的大量傳輸會佔據網路頻寬，在網路基礎設施不佳區域有可能造成網路癱瘓；(4)儘管網際網路製圖已有所簡化，但許多製圖技術、程式模組和服務協定仍有學習門檻無法破除，造成普及不易。(5) 民間公司產製的地理資料價格不斐，政府機關產製的地理資料常因國安問題加以設限，以致資料獲取困難；(6)如何在尊重著作權並兼顧隱私權的前提下，分享高精度與高解析度圖資 (Neumann, 2008)。. §2.2.1.2網路地圖的分類 Calkins(1996)將網路地圖分類成以下四種：. 1.. 圖形擷圖(Graphic Snapshots)：硬拷貝(Hardcopy)的地圖，如：一張.jpg 的地圖。. 2.. 空間資料庫(Spatial Database Catalogs and Libraries)：提供原始地理空間資料的網站，如：DEM。. 3.. 地圖產生器(Map Generators)：使用者輸入位置，即在地圖中呈現該位置。. 4.. 即時地圖瀏覽器(Real-time Map Browsers)：使用者可以加入特定的主題圖層，或透過屬性資料來查詢。. Langer(2002)是以「互動性」、「動態或靜態」、「提供 GIS 功能的程度」將地. 29.