簡易檢索 / 詳目顯示

回結果列表
研究生： 劉永清
Liu, Yung-Ching
論文名稱： 利用漸進式網頁應用程式技術建置開放地理空間資料檢視器
Use Progressive Web Apps Construction Geospatial Data Reader
指導教授： 張國楨
Chang, Kuo-Chen
口試委員： 雷祖強
Lei, Tsu-Chiang
陳俊愷
Chen, Chun-Kai
張國楨
Chang, Kuo-Chen
口試日期： 2023/07/16
學位類別： 碩士
Master
系所名稱： 地理學系空間資訊碩士在職專班
Department of Geography_Continuing Education Master's Program of Geospatial Information Science
論文出版年： 2023
畢業學年度： 111
語文別： 中文
論文頁數： 102
中文關鍵詞： 漸進式網路應用程式 、地理空間資料 、檢視器
英文關鍵詞： PWA, GIS, DataReader
DOI URL： http://doi.org/10.6345/NTNU202301339
論文種類： 學術論文
相關次數： 點閱：144  下載：8 
分享至:
查詢本校圖書館目錄 查詢臺灣博碩士論文知識加值系統 勘誤回報

    • 在政府推動推動資料開放的政策下，各種公開的電子資料其中也包含地理空間資料，如KML、Shapefile、GeoJson...等，但地理空間資料的瀏覽在一般民眾中難以像圖片、PDF、Office檔案一樣簡單的瀏覽，需安裝特定的軟體如QGIS來檢視，對這些一般民眾來說是複雜難以使用的。
    本研究使用漸進式網頁應用程式技術來建置免安裝、簡單易用的地理空間資料檢視器，提供使用者瀏覽檢視常見的地理空間資料檔案，如：KML、GeoJson、Shapefile，使用體驗能像檢視PDF、圖片般的一樣簡單，不會像傳統GIS軟體一樣有提供豐富但讓使用者不知所措的功能，大幅降低了瀏覽檢視地理空間資料檔案的操作門檻。
    資料提供者也毋須花費大量時間經費建置圖台就只為了呈現提供的地理空間資料，資料提供者只要專注於提供地理空間資料檔案，並告知使用者可使用，如同發布PDF檔案但毋須建置PDF檢視平台一樣，可降低資料提供者的成本，毋須建置維護一套圖台系統。
    本研究建置的命名為簡易地理資料檢視器，其能夠大幅降低了瀏覽檢視地理空間資料檔案的操作門檻，降低資料提供者的成本，藉以促進地理空間資料的開放與流通。

    Under the government's policy to promote data openness, various types of publicly available electronic data also include geospatial information such as KML, Shapefile, GeoJson, and more. However, the browsing of geospatial data is not as straightforward for the general public as viewing images, PDFs, or Office files. It requires the installation of specific software like QGIS to view, which can be complex and challenging for these individuals.
    This study utilizes progressive web application technology to create an installation-free and user-friendly geospatial data viewer. It offers users the ability to easily browse and view common geospatial data files, such as KML, GeoJson, and Shapefile. The user experience is made as simple as viewing PDFs or images, without overwhelming users with the extensive features that traditional GIS software offers. This significantly lowers the barriers to accessing and viewing geospatial data files.
    Data providers also no longer need to invest significant time and resources into setting up mapping platforms solely for presenting geospatial data. Instead, they can focus on providing the geospatial data files and informing users about their availability. Similar to publishing PDF files without the need for a PDF viewing platform, this approach reduces the costs for data providers and eliminates the necessity to establish and maintain an entire mapping system.
    The solution developed in this study is named the "Simple GeoData Viewer." It drastically reduces the hurdles associated with browsing and viewing geospatial data files and concurrently minimizes costs for data providers. This endeavor aims to facilitate the openness and dissemination of geospatial data.

    摘要 i Abstract ii 目次 iii 表次 vi 圖次 vii 第一章 緒論 1 第一節 研究動機 1 第二節 研究目的 1 第三節 研究範圍 2 第二章 文獻探討 3 第一節 使用地理空間資料時的非友善案例 3 一、 案例：不知道要用什麼軟體開啟之一 3 二、 案例：不知道用用什麼軟體開啟之二 4 三、 案例：不知道用用什麼軟體開啟之三 5 四、 案例：不知道這是什麼檔案資料格式 6 五、 案例：不知道要如何使用資料 7 第二節 常見的地理空間資料格式 8 一、 KML 9 二、 GeoJSon 13 三、 Shapefile 20 第三節 常見免費的GIS應用程式探討 21 一、 使用者介面簡介 22 二、 平台功能支援表 26 第四節 漸進式網路應用程式技術 27 一、 漸進式網路應用程式架構 27 二、 漸進式網路應用程式主要運作階段 29 第五節 小結 31 第三章 研究方法 32 第一節 研究流程 32 第二節 研究設計 34 一、 使用者案例情境設計 34 二、 使用者介面雛形設計 36 第三節 研究工具 39 一、 工具套件 39 二、 開放原始碼授權條款 41 第四章 研究成果 42 第一節 系統畫面成果展示 42 一、 主畫面成果 42 二、 資料圖層側選單成果 43 三、 屬性資料表版面成果 43 第二節 功能與資料成果展示 44 一、 使用者檔案操作成果 44 二、 使用者地圖操作成果 45 三、 使用者資料圖層清單操作成果 46 四、 使用者屬性資料表操作 47 五、 行動版裝置畫面成果 48 第三節 漸進式網頁應用程式安裝模式 50 第五章 結論與建議 52 第一節 結論 52 第二節 後續研究及建議 53 參考文獻 54 附錄 58 附錄一：HTML樣板 58 附錄二：fileReaderHelper.js 67 附錄三：styleGenerator.js 68 附錄四：layerGenerator.js 74 附錄五：main.js 79 附錄六：manifest.json 97 附錄七：sw.js 100

    1. 道路(橋梁)歷史災情. 政府資料開放平臺. Accessed June 2, 2023. https://data.gov.tw/dataset/31020
    2. 防災資訊_淹水警戒. 政府資料開放平臺. Accessed June 2, 2023. https://data.gov.tw/dataset/5982
    3. 公有土地資料(土地位置資訊). 政府資料開放平臺. Accessed June 2, 2023. https://data.gov.tw/dataset/98062
    4. 省道里程坐標. 政府資料開放平臺. Accessed June 2, 2023. https://data.gov.tw/dataset/7040?page=2
    5. 臺南市公共管線圖資-共同管道管線. 政府資料開放平臺. Accessed June 2, 2023. https://data.gov.tw/dataset/122516
    6. 臺灣鐵路. 政府資料開放平臺. Accessed June 2, 2023. https://data.gov.tw/dataset/73220
    7. 玉山國家公園簡易炊煮區及吸菸區點位. 政府資料開放平臺. Accessed June 2, 2023. https://data.gov.tw/dataset/93173
    8. 中央管海堤. 政府資料開放平臺. Accessed June 2, 2023. https://data.gov.tw/dataset/32731
    9. A service worker’s life. Chrome Developers. Published September 24, 2021. Accessed June 2, 2023. https://developer.chrome.com/docs/workbox/service-worker-lifecycle/
    10. Architecture. web.dev. Accessed June 2, 2023. https://web.dev/learn/pwa/architecture/
    11. MSEdgeTeam. Best practices for PWAs - Microsoft Edge Development. Published March 28, 2023. Accessed June 2, 2023. https://learn.microsoft.com/en-us/microsoft-edge/progressive-web-apps-chromium/how-to/best-practices
    12. Beyond SPAs - alternative architectures for your PWA. Chrome Developers. Published May 23, 2018. Accessed June 2, 2023. https://developer.chrome.com/blog/beyond-spa/
    13. File API. Accessed June 2, 2023. https://www.w3.org/TR/FileAPI/
    14. File Handling. Published online February 24, 2023. Accessed June 2, 2023. https://github.com/WICG/file-handling
    15. File System Access API. Published online May 29, 2023. Accessed June 2, 2023. https://github.com/WICG/file-system-access/blob/f0fd3b355cdb4f874c6236f26ea524ebf0b5fe93/EXPLAINER.md
    16. MSEdgeTeam. Get started with Progressive Web Apps - Microsoft Edge Development. Published March 28, 2023. Accessed June 2, 2023. https://learn.microsoft.com/en-us/microsoft-edge/progressive-web-apps-chromium/how-to/
    17. GPX: the GPS Exchange Format. Accessed June 2, 2023. https://www.topografix.com/gpx.asp
    18. MSEdgeTeam. Handle links to your Progressive Web Apps - Microsoft Edge Development. Published September 22, 2022. Accessed June 2, 2023. https://learn.microsoft.com/en-us/microsoft-edge/progressive-web-apps-chromium/how-to/handle-urls
    19. MSEdgeTeam. Handle protocols in Progressive Web Apps - Microsoft Edge Development. Published January 24, 2023. Accessed June 2, 2023. https://learn.microsoft.com/en-us/microsoft-edge/progressive-web-apps-chromium/how-to/handle-protocols
    20. HTML Drag and Drop API - Web APIs | MDN. Published April 19, 2023. Accessed June 2, 2023. https://developer.mozilla.org/en-US/docs/Web/API/HTML_Drag_and_Drop_API
    21. Instant Loading Web Apps with an Application Shell Architecture. Chrome Developers. Published November 16, 2015. Accessed June 2, 2023. https://developer.chrome.com/blog/app-shell/
    22. KML. Open Geospatial Consortium. Accessed June 2, 2023. https://www.ogc.org/standard/kml/
    23. Let installed web applications be file handlers. Chrome Developers. Published October 22, 2020. Accessed June 2, 2023. https://developer.chrome.com/articles/file-handling/
    24. Manifest - File Handlers. Chrome Developers. Published May 11, 2013. Accessed June 2, 2023. https://developer.chrome.com/docs/apps/manifest/file_handlers/
    25. New in Chrome 76. Chrome Developers. Published July 30, 2019. Accessed June 2, 2023. https://developer.chrome.com/blog/new-in-chrome-76/
    26. OS Integration. web.dev. Accessed June 2, 2023. https://web.dev/learn/pwa/os-integration/
    27. MSEdgeTeam. Overview of Progressive Web Apps (PWAs) - Microsoft Edge Development. Published January 24, 2023. Accessed June 2, 2023. https://learn.microsoft.com/en-us/microsoft-edge/progressive-web-apps-chromium/
    28. Progressive web app structure - Progressive web apps (PWAs) | MDN. Published April 5, 2023. Accessed June 2, 2023. https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps/Tutorials/js13kGames/App_structure
    29. Service Worker API - Web APIs | MDN. Published April 13, 2023. Accessed June 2, 2023. https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API
    30. Service Workers. Accessed June 2, 2023. https://www.w3.org/TR/service-workers/
    31. Butler H, Daly M, Doyle A, Gillies S, Schaub T, Hagen S. The GeoJSON Format. Internet Engineering Task Force; 2016. doi:10.17487/RFC7946
    32. The service worker lifecycle. web.dev. Accessed June 2, 2023. https://web.dev/service-worker-lifecycle/
    33. Tips for integrating your PWA into your desktop environment by Diego González, TPAC 2021 Group udpates and demos. Accessed June 2, 2023. https://www.w3.org/2021/10/TPAC/demos/pwa.html
    34. MSEdgeTeam. Use a web app manifest to integrate a Progressive Web App into the operating system - Microsoft Edge Development. Published March 13, 2023. Accessed June 2, 2023. https://learn.microsoft.com/en-us/microsoft-edge/progressive-web-apps-chromium/how-to/web-app-manifests
    35. MSEdgeTeam. Use Service Workers to manage network requests - Microsoft Edge Development. Published January 24, 2023. Accessed June 2, 2023. https://learn.microsoft.com/en-us/microsoft-edge/progressive-web-apps-chromium/how-to/service-workers
    36. Using Service Workers - Web APIs | MDN. Published February 28, 2023. Accessed June 2, 2023. https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API/Using_Service_Workers
    37. Web App Launch Handling. Published online May 26, 2023. Accessed June 2, 2023. https://github.com/WICG/web-app-launch/blob/ddc64da204af342ed2a908d96aa1401d025fbd70/launch_handler.md
    38. Web App Manifest - Application Information. Accessed June 2, 2023. https://www.w3.org/TR/manifest-app-info/
    39. Web Application Manifest. Accessed June 2, 2023. https://www.w3.org/TR/appmanifest/
    40. Web Workers API - Web APIs | MDN. Published February 26, 2023. Accessed June 2, 2023. https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API
    41. ISC License. Open Source Initiative. Published March 13, 2008. Accessed June 2, 2023. https://opensource.org/license/isc-license-txt/
    42. The 2-Clause BSD License. Open Source Initiative. Published October 31, 2006. Accessed June 2, 2023. https://opensource.org/license/bsd-2-clause/
    43. The MIT License. Open Source Initiative. Published October 31, 2006. Accessed June 2, 2023. https://opensource.org/license/mit/
    44. Service Workers. DEV Community. Published May 8, 2019. Accessed June 2, 2023. https://dev.to/tbrixey/service-workers-3c3g

    下載圖示
    QR CODE