WebGIS原理與應用朱進蘇州科技大學環境學院2024年5月30日第2章WebGIS基礎技術2024/5/30slide2WebGIS基礎技術2.1Web的原理和基礎技術2.2WebGIS的基本架構和組成部分2.3瘦客戶端和胖客戶端架構2.4用戶體驗設計2024/5/30slide3學習目標掌握WebGIS的原理和基礎技術掌握WebGIS的基本架構和組成部分掌握WebGIS的瘦客戶端、胖客戶端架構了解WebGIS的用戶體驗設計2024/5/30slide42.1Web的原理和基礎技術2024/5/30slide5Web的基本原理三層架構客戶端/服務器（C/S）架構模式。三層架構：數據層、邏輯層、表現層。Web客戶端（Client），Web服務器（Server）。Client端是瀏覽器（Browser）時，也稱為瀏覽器/服務器（B/S）模式。2024/5/30slide6Web的基本原理WWW技術之三大基石國際標準，由W3C（世界萬維網聯盟）維護HTTP協議：定義了一套server與client進行請求和應答時所應遵循的規范。八種請求方式：GET、POST、HEAD、PUT、DELETE、TRACE、OPTIONS和CONNECT。（GET與POST最常用）2024/5/30slide7Web的基本原理WWW技術之三大基石HTTP特點簡單：鍵入URL或點擊鏈接即可執行。無記憶狀態：server對client做出響應后，它們間的連接立即被撤銷，減輕其負擔。靈活：支持的傳輸內容豐富：圖片、文件、audio、video。HTTPSHTTPSecure，安全超文本傳輸協議建立在安全套接層之上的安全版HTTP加密，傳輸敏感信息2024/5/30slide8Web的基本原理WWW技術之三大基石URL-描述Internet上網頁和其它資源地址的一種標識方法。大家俗稱的網址基本格式：Protocol://hostname[:port]/filepath?query_string協議://主機[:端口]/文件路徑?查詢參數2024/5/30slide9Web的基本原理WWW技術之三大基石HTML-描述網頁的語言包含內容、局部、格式等信息Browser解釋HTML代碼，按照指定的格式顯示其內容HTML是一種標記語言，由一套標簽組成的文本文件外觀和布局由CSS(cascadingstylesheets，層疊樣式表)來定義2024/5/30slide10Web的基本原理WWW技術之三大基石最新標準-HTML5包括HTML、CSS和Javascript在內的一套技術的組合在不依賴于AdobeFlash和MSSilverlight時，實現豐富的互聯網應用增添了處理多媒體和圖片內容的語法支持<video>,<audio>,<canvas>標簽支持SVG(scalablevectorgraphics，可縮放矢量圖形)2024/5/30slide11相關技術Web開發相關技術Web服務器-Apache、Tomcat、IIS等互聯網-數據交換格式XML，JSON等Web客戶端Web瀏覽器瀏覽器端編程語言桌面/移動平臺編程語言2024/5/30slide12相關技術服務端技術Web服務器-接收HTTP請求，對請求進行響應處理，最后返回結果到客戶端。返回響應結果靜態頁面或圖片執行動態程序：ASP.NET等，執行業務邏輯常見Web

serverApache和Tomcat，Apache軟件基金會的開源Web服務器，應用廣泛IIS（InternetInformationServer），主要支持.NetOracle的GlassFishIBM的WebSphere2024/5/30slide13相關技術服務端技術服務端編程語言-運行于Server中的服務端程序Java系列包括JavaEE(JavaEnterpriseEdition),JavaSE(JavaStandardEdition),Servlet,JSP和JSP(JavaServerFaces)等。.NET系列包括ASP.NET,C#和VB.NET等，包含于.NET框架中2024/5/30slide14相關技術客戶端/瀏覽器端技術第一類：瀏覽器和運行于瀏覽器中的應用程序第二類：瀏覽器外運行的桌面和移動應用程序Browser獲取和顯示Webserver上HTML和其它程序結果，并讓用戶與這些文件交互的軟件遵循HTTP、HTML、Javascrip規范的client瀏覽器知道如何與Webserver通信、如何顯示HTML頁面、如何解釋和執行Javascript腳本常見：MSIE、谷歌Chrome、MozillaFirefox、蘋果Safari2024/5/30slide15相關技術瀏覽器端編程技術Javascript：Netscape（網景）公司1995年推出的運行于瀏覽器內的腳本語言AJAX(AsynchronousJavascriptandXML，異步Javascript與XML)2005年左右開始流行不是新技術，而是對現有技術（JS和XML）的組合支持browser與server的異步通信模式，網頁在后臺從server上讀取的同時，用戶可與當前頁面交互，大大提高用戶的體驗數據和界面相分離的設計模式(DesignPattern)也可運行于智能手機、平板電腦的Browser中2024/5/30slide16相關技術瀏覽器端編程技術ApacheFlex：/以前稱為AdobeFlex，Adobe2011年捐贈給Apache基金會可以開發高度交互的、具有表現力、跨Browser的Web應用是富互聯網（RichInternetApplications，RIA）應用開發的有力工具用MXML編寫UI，用ActionScript語言編寫客戶端邏輯基于Flash插件，可以運行于多種browser中基于AIR運行環境，可以不依賴于browser，直接運行于多種操作系統之上2024/5/30slide17相關技術瀏覽器端編程技術MSSilverlight：/silverlight/與Flex類似可以開發高度交互的、具有表現力、跨Browser的Web應用使用XAML編寫界面，.net語言如C#或者VB.Net編寫業務邏輯基于MSSilverlight插件，可運行于主流桌面browser之中基于WPF(WindowsPresentationFoudation)運行環境，可以不依賴于browser，直接運行于Windows和WindowsPhone操作系統之上2024/5/30slide18相關技術服務端和客戶端的信息交換格式一般交換模式：Client將參數放在URL中創遞給server，server返回HTML除了HTML之外的其它格式XML（ExtensibleMarkupLanguage，XML）：允許用戶自定義tag和屬性的標記語言。不足：繁雜，文件較大，解析效率較低，不利于在JS中使用。2024/5/30slide19相關技術服務端和客戶端的信息交換格式除了HTML之外的其它格式Javascript對象表示法（JavascriptObjectNotation，JSON）：輕量級的數據交換格式，比XML輕巧，解析效率高，在逐步代替XMLAMF（ActionMessageFormat）：Flex的二進制數據交換格式，Flex處理AMF效率比JSON更高。2024/5/30slide202.2WebGIS的基本框架與組成部分2024/5/30slide21基本架構WebGIS基本架構WebGIS應用是在Web應用基礎上添加了GIS功能三層架構仍然分為數據層、邏輯層（即中間層）和表現層2024/5/30slide22基本架構WebGIS基本架構Web

client向Webserver發送http請求Webserver將GIS相關功能請求轉發給GIS

serverGISserver從GISdatabase中讀取所需數據，對請求進行處理GISserver將結果通過HTTP響應返回到client中顯示2024/5/30slide23WebGISserverWebGIS服務器歷史以ESRI產品為例第一代產品（1996）：ArcViewIMS（InternetMapServer）和MapOjbectsIMS，第二代產品（1998）：ArcIMS，對第一代產品增強和擴展第三代產品（2004）：ArcGISServer，功能完整。2024/5/30slide24WebGISserver是WebGIS中最重要的部分WebGISserverArcGISServer功能發布二維、三維地圖瀏覽地圖查詢、檢索、要素編輯、數據提取、跟蹤、地址和位置查詢、路徑分析、幾何處理（坐標系變換）、元數據檢索和地理處理功能以WebService的方式發布其服務，支持主流REST接口提供OGCWMS、WFS、WCS、CSW、GML、KML等標準服務，支持數據互操作利用緩存、優化、云計算等方法提高系統效率，效率高，可擴展性強提供server端API，client端API和桌面、移動平臺開發接口2024/5/30slide25地理數據庫GISdatabase地理數據庫是WebGIS應用的基礎支撐，一個WebGIS應用的價值往往取決于其數據的質量一般可以存儲矢量數據、柵格數據專業的GIS數據庫還支持CAD、3D、交通網絡、GPS坐標、激光雷達（lightdetectionandranging,LiDAR）等類型的數據。2024/5/30slide26WebGIS客戶端WebGIS客戶端的角色整個系統的最終用戶界面：用戶交互、發送請求、顯示結果等。客戶端，尤其是胖客戶端，可以運行一些分析處理功能，如制作專題圖，生成HeatMap（熱圖）等。2024/5/30slide27WebGIS客戶端WebGIS客戶端的類型Web瀏覽器客戶端：運行于browser之中，如googlemaps，百度地圖、地圖瀏覽器。桌面應用程序客戶端：直接運行于os之上，不受browser“沙箱”環境（sandbox，js和插件程序被嚴格控制的安全運行環境）限制。Client可以方便訪問本地資源，適用于資源密集型的Web應用。如GoogleEarth，ArcGISExplorerDesktop，ArcGISDesktop等。移動客戶端：兩類基于移動瀏覽器基于本地APP2024/5/30slide28WebGIS客戶端具有通用性WebGIS客戶端的類型WebGIS客戶端一般針對具體應用，不具有通用性能夠顯示和調用規范的Web服務和數據的WebGIS客戶端具有通用性，被稱為地理瀏覽器（Geobrowser）ArcGISExplorerDesktop：顯示OGCWMS、KML/KMZ、GeoRSS和ArcGISServerservices等標準數據和服務。碳項目Gaia（CarbonProjectGaia）二維地理瀏覽器，訪問OGCWMS、WMTS、KML、GML、OpenStreetMap等。http:///2024/5/30slide29WebGIS客戶端具有通用性WebGIS客戶端的類型ArcGISExplorer2024/5/30slide30WebGIS客戶端具有通用性WebGIS客戶端的類型Gaia2024/5/30slide31WebGIS客戶端具有通用性WebGIS客戶端的類型虛擬地球（VirtualGlobe）：地球或其他世界的三維軟件模型，從Web上直接獲取并顯示數據和地圖的成為在線虛擬地球（OnlineVirtualGlobe），如GoogleEarth、NASAworldwind等。2024/5/30slide32WebGIS面臨的挑戰面臨的挑戰（1）地理數據庫需要支撐頻繁數據讀寫的壓力（2）GIS服務器需要支撐多用戶頻繁訪問的壓力（3）Internet需要支撐頻繁傳遞大量數據的壓力2024/5/30slide33WebGIS面臨的挑戰面臨的挑戰（4）客戶端（特別是Webbrowser）GIS功能的不足（5）最終用戶往往缺乏GIS專業知識經驗2024/5/30slide342.3瘦客戶端和胖客戶端架構2024/5/30slide35客戶端和服務端間的功能分配瘦、胖客戶端根據WebGIS客戶端和服務端之間不同的功能分配，WebGIS系統可以分為瘦客戶端和胖客戶端兩種架構。瘦客戶端架構：client承擔較少的任務，主要負責向服務器發送請求；server承擔大部分任務，如生成地圖和執行分析處理。優點：（1）除了Webbrowser，用戶不需安裝任何GIS軟件和插件（2）client不需配置功能強大的PC，在低端PC上也可以運行不足：（1）server端負擔較重（2）交互性弱，UI使用普通HTML和部分簡單的JS，表現力一般2024/5/30slide36客戶端和服務端間的功能分配瘦、胖客戶端胖客戶端架構：client承擔較多的任務，客戶端上需安裝相應的Web瀏覽器插件，或采用客戶端本地（或嵌入式）應用程序來實現。優點：（1）用戶交互速度快，很多數據和程序在客戶端（2）server端負擔較輕不足：（1）需要事先完成相應安裝，下載插件或本地程序。（2）面臨網絡帶寬和客戶機計算能力的限制，傳輸大量數據或在client端執行高強度的地理分析計算，往往不可行。2024/5/30slide37瘦客戶端和胖客戶端架構最佳模式隨著JS、HTML5的發展，客戶端已經能夠承受更加復雜的任務最佳模式分為基礎底圖、操作圖層和任務三大組成部分。基礎底圖：地理位置和環境基礎，在server端生成。一般是相對靜態的，更新頻率較低，一般預先制作成瓦塊地圖，以提高瀏覽速度。2024/5/30slide38WebGIS應用=基礎底圖+操作圖層+任務瘦客戶端和胖客戶端架構最佳模式操作圖層：繪制在底圖之上，是最終用戶瀏覽、查詢或編輯操作的主題圖層。一般被下載到client，由client管理和繪制。用戶可快速與之進行交互，還可采用比例尺依賴，即只在放大到一定比例時才顯示該圖層。任務：若數據量小，任務計算簡單，則在client端處理，否則在server端處理。2024/5/30slide39WebGIS應用=基礎底圖+操作圖層+任務最佳模式最佳模式實例2024/5/30slide40最佳模式最佳模式實例波士頓太陽能項目-讓用戶了解每家屋頂的太陽能潛力。2024/5/30slide41最佳模式最佳模式實例波士頓太陽能項目-讓用戶了解每家屋頂的太陽能潛力。基礎底圖：波士頓街道底圖、地形底圖和航空影像底圖。包含每座建筑的屋頂信息操作圖層：綠色能源（太陽能、風能、水能、生物質能等）是操作圖層，傳輸到client端。鼠標點擊顯示其發電瓦數和照片。任務：選擇屋頂或畫多邊形，計算其發電量。密集型計算，需要地形等數據，在server端執行。2024/5/30slide422.4用戶體驗設計2024/5/30slide43用戶體驗概念用戶體驗(UserExperience，UE)是用戶在使用某種產品或服務過程中所建立起來的滿意程度。產品經理（ProductManager，PM）需要做的事情WebGIS用戶體驗設計的四個原則有用性-正確理解并實現需求、功能易用性快捷性-GIS服務器和Web服務器的性能優化趣味性2024/5/30slide44