webgis原理與應用第9章-arcgis api for javascript開發_第1頁
webgis原理與應用第9章-arcgis api for javascript開發_第2頁
webgis原理與應用第9章-arcgis api for javascript開發_第3頁
webgis原理與應用第9章-arcgis api for javascript開發_第4頁
webgis原理與應用第9章-arcgis api for javascript開發_第5頁
已閱讀5頁，還剩104頁未讀， 繼續免費閱讀

下載本文檔

版權說明：本文檔由用戶提供并上傳，收益歸屬內容提供方，若內容存在侵權，請進行舉報或認領

文檔簡介

WebGIS原理與應用朱進蘇州科技大學環境學院2023年2月23日第9章ArcGISAPIforJavaScript開發2023/2/23slide2內容9.1ArcGISAPIforJavaScript概述9.2ArcGISAPIforJavaScript版的HelloWorld9.3ArcGISAPIforJavaScript部署9.4ArcGISAPIforJavaScript功能概述9.5ArcGISAPIforJavaScript與Dojo的關系9.6ArcGISAPIforJavaScript開發原理9.7ArcGISAPIforJavaScript開發環境2023/2/23slide39.1ArcGISAPIforJavaScript概述2023/2/23slide4ArcGISServerRESTAPI2023/2/23slide5ArcGISServerRESTAPIAPIhelp:

2023/2/23slide6ArcGISServerRESTAPIMapServer的Export操作2023/2/23slide7ArcGISAPIforJavaScript概述直接調用RESTAPI比較繁瑣，需要傳輸URL參數，解析JSON等ArcGISAPIforJavaScript是ArcGISServer9.3新增的一套API通過面向對象的思想（封裝、繼承等）包裝了RESTAPI，簡化了程序員的工作，為創建WebGIS應用提供了輕量級的解決方案除了調用REST，JSAPI還為客戶端用戶的交互提供了很多功能2023/2/23slide8除了JSAPI，還有SilverlightAPI，FlexAPI，AndroidSDK，iOS

SDK都封裝了RESTAPI，背后的功臣是RESTAPIArcGISAPIforJavaScript概述在客戶端可以利用它來調用ArcGISServer提供的各種服務僅僅利用腳本調用，不需要服務端編程，降低了開發門檻目前的版本為3.162023/2/23slide9ArcGISAPIforJavaScript概述在2015年7月份發布了4.0Beta版本，更好的支持3D

2023/2/23slide10ArcGISAPIforJavaScript概述由于JS的跨平臺性以及不用安裝插件等特點，未來Esri主要支持JSAPISilverlightAPI和FlexAPI已是明日黃花，Esri不更新或者緩慢更新2023/2/23slide119.2ArcGISAPIforJavaScript版的HelloWorld2023/2/23slide12JSAPI版本的HelloWorldStep1-創建基本的HTML頁面2023/2/23slide13JSAPI版本的HelloWorldStep2-在<head>部分添加ESRI的樣式表和引用JS文件其中的CSS文件定義了小部件widgets和組件的樣式3.16是API版本號，當發布新的API時，更新此版本號即可還可以引用Dojo主題的css，其中定義了用戶界面的字體、顏色、大小等2023/2/23slide14JSAPI版本的HelloWorldStep3-加載地圖模塊利用<script>tag加載Dojo的map模塊這里JS直接寫在HTML中，復雜的項目JS寫在單獨的JS文件中Dojo的requie()函數用來加載模塊JSAPI構建于Dojo之上2023/2/23slide15JSAPI版本的HelloWorldStep4-確保DOM可用dojo/domReady!用來確保DOM(文檔對象模型，DocumentObjectModel)可用，DOM可用后，函數才可以運行！表示domReady是一個Dojo的AMDloaderplug-inDOM可以以一種獨立于平臺和語言的方式訪問和修改一個文檔的內容和結構。換句話說，這是表示和處理一個HTML或XML文檔的常用方法。2023/2/23slide16JSAPI版本的HelloWorldStep5-創建地圖利用了esri/map模塊里面的Mapclass“mapDiv”是Div的ID{}包括了Map的屬性其它地圖選項2023/2/23slide17JSAPI版本的HelloWorldStep6-定義樣式Map填滿瀏覽器窗口，在<head>tag里面增加2023/2/23slide18JSAPI版本的HelloWorld查看效果直接用瀏覽器打開也可以部署在IIS或者Tomcat服務器上2023/2/23slide19JSAPI版本的HelloWorld完整HTML文件2023/2/23slide209.3ArcGISAPIforJavaScript部署2023/2/23slide21JSAPI部署部署幫助網站：

離線包的下載jshelp/intro_accessapi.html2023/2/23slide22JSAPI部署部署

注冊ESRI開發者賬號下載API和SDK2023/2/23slide23JSAPI部署部署方式通過http引用：<scripttype="text/javascript"src=""></script>項目方式部署：<scripttype="text/javascript"src=“library/3.16/3.16/init.js"></script>2023/2/23slide24JSAPI部署部署arcgis_js_v316_api/arcgis_js_api/library/3.16/install_win.htmlInstallnotesfortheArcGISAPIforJavaScript兩種build：NormalbuildCompactbuild-移除DojoDijit依賴2023/2/23slide25JSAPI部署部署OpenC:\Inetpub\wwwroot\arcgis_js_api\library\3.16\3.16\init.jsinatexteditorandsearchforthetext'[HOSTNAME_AND_PATH_TO_JSAPI]',andreplacethistextwith"<myserver>/arcgis_js_api/library/3.16/3.16/“C:\Inetpub\wwwroot\arcgis_js_api\library\3.16\3.16\dojo\dojo.js同上處理2023/2/23slide26JSAPI部署部署復制API和SDK至C:\inetpub\wwwroot\arcgis_js_api安裝并啟動IIS2023/2/23slide27JSAPI部署部署2023/2/23slide28JSAPI部署部署2023/2/23slide29JSAPI部署部署2023/2/23slide30JSAPISDKSDK包含了指南，API參考，Sample代碼等2023/2/23slide31JSAPISDK指南2023/2/23slide32JSAPISDKAPI參考2023/2/23slide33JSAPISDKSample代碼2023/2/23slide34JSAPISDKSample代碼2023/2/23slide35JSAPISDKSample代碼-在sanbox沙箱中運行2023/2/23slide36JSAPISDK論壇-Forum2023/2/23slide379.4ArcGISAPIforJavaScript功能概述2023/2/23slide38JSAPI功能概述功能空間數據展示：加載地圖服務，影像服務,,WMS等。客戶端Mashup:將來自不同服務器、不同類型的服務在客戶端聚合后統一呈現給客戶。圖形繪制：在地圖上交互式地繪制查詢范圍或地理標記等。符號渲染：提供對圖形進行符號化，要素生成專題圖和服務器端渲染等2023/2/23slide39JSAPI功能概述功能查詢檢索：基于屬性和空間位置進行查詢等地理處理：調用ArcGISforServer發布的地理處理服務（Geoprocessing服務），執行空間分析網絡分析：計算最優路徑、臨近設施和服務區域。在線編輯：通過要素服務的圖形、屬性在線編輯2023/2/23slide40JSAPI功能概述功能時態感知：展示、查詢具有間特征的地圖服務或影像數據。影像處理：提供動態鑲嵌、實時柵格函數處理等功能。地圖輸出：提供多種地圖圖片導出和服務端打印功能2023/2/23slide419.5ArcGISAPIforJavaScript與Dojo的關系2023/2/23slide42JSAPI與Dojo的關系概念JSAPI構建于Dojo之上，可以利用Dojo來屏蔽瀏覽器之間的差異2023/2/23slide43JSAPI與Dojo的關系Dojo隨著Web2.0，Ajax（異步javascript和XML）和RIA（RichInternetApplications）的熱潮，出現了各種Ajax開發工具包，Dojo是其中的一種，其它還有jQuery等Dojo是一個JS的開源DHTML工具包

2023/2/23slide44JSAPI與Dojo的關系Dojo特性更容易為Web頁面添加動態能力利用Dojo組件，提升web應用的可用性和交互性其包加載機制和模塊化結構，可以有高擴展性，減輕用戶開發工作量屏蔽browser之間的差異2023/2/23slide45JSAPI與Dojo的關系Dojo模塊三大模塊：Core、Dijit和DojoXCore提供Ajax、事件、基于CSS的查詢、動畫以及JSON操作API等Dijit是一個可換皮膚，基于模板的Web界面控件庫，包含WidgetDojoX包含一些新穎的代碼和控件，例如DataGrid、Chart、離線應用等，還包含一個工具庫(Util)模塊，其中有單元測試框架、從源碼生成文檔的工具，以及JS資源打包及壓縮工具2023/2/23slide46JSAPI與Dojo的關系Dojo模塊間的關系2023/2/23slide47JSAPI與Dojo的關系Dojo基本函數2023/2/23slide48JSAPI與Dojo的關系Dojo基本函數2023/2/23slide49JSAPI與Dojo的關系Dojo基本函數2023/2/23slide50JSAPI與Dojo的關系Dojo基本函數2023/2/23slide51JSAPI與Dojo的關系Dojo基本函數2023/2/23slide52JSAPI與Dojo的關系Dojo基本函數2023/2/23slide53JSAPI與Dojo的關系Dojo基本函數2023/2/23slide54JSAPI與Dojo的關系Dojo基本函數2023/2/23slide559.6ArcGISAPIforJavaScript開發原理2023/2/23slide56JSAPI開發原理原理JSAPI開發的程序可以部署到Web服務器上，如IIS用戶通過browser或移動客戶端進行訪問和操作模式1：JSAPI監控用戶操作，將用戶的操作按照ArcGSIServer提供的RESTAPI格式轉化為HTTP請求，設置URL參數，提交給Server，Server收到請求處理后，返回JSON格式結果給客戶端，JSAPI解析結果，并展現在browser中模式2：不需要與Server通信，如添加Graphic，測量模式，只在客戶端生成圖形等，只有當用戶需要保存這些數據時才需要與server通信2023/2/23slide57JSAPI開發原理原理2023/2/23slide58JSAPI重要對象地圖(Map)Map是承載圖層的容器，主要用于呈現地圖服務、影像服務，此外還可展示WMS服務等。需要HTML頁面中的DIV容器作為根節點，所有地圖中的子元素都作為DIV容器的子節點存在。Map中可以包含若干個Layer，一個layer只有被添加到map中才能顯示出來2023/2/23slide59JSAPI重要對象地圖(Map)Map對象初始化后包含一個默認的Graphic圖層，可通過map.graphics獲得，可以繪制自定義圖形Map還包含一個現實要素屬性信息的彈出框InfoWindow，一個map中只能包含一個彈出框，可以按照用戶的定制來顯示某一個要素的屬性信息，甚至是圖片和外部鏈接2023/2/23slide60JSAPI重要對象圖層(Layer)圖層是承載服務的載體（GraphicLayer除外），ArcGISServer將GIS資源作為服務發布出來，要想在browser端看到服務，就必須將服務和圖層關聯起來，不同的服務對應不同的圖層。2023/2/23slide61JSAPI重要對象圖層(Layer)2023/2/23slide62JSAPI重要對象圖層(Layer)2023/2/23slide63JSAPI重要對象圖層(Layer)后加入的圖層在Map的最上面圖層順序：2023/2/23slide64JSAPI重要對象幾何對象(Geometry)表示對象的顯示形式，可以分為點、多點、線、矩形、多邊形、ScreenPoint等，ScreenPoint以像素的方式表示點。2023/2/23slide65JSAPI重要對象幾何對象(Geometry)2023/2/23slide66JSAPI重要對象符號(Symbol)定義了如何在GraphicLayer上顯示點、線、面和文本，包括圖形的顏色、邊框線寬度、透明度等。每種符號都特定于一種類型（點、線、面和文本）。2023/2/23slide67JSAPI重要對象符號(Symbol)2023/2/23slide68JSAPI重要對象圖形(Graphic)Geometry定義了對象的形狀，Symbol定義了圖形是如何顯示的，Graphic可以包含一些屬性信息，使用InfoTemplate展示屬性。最終的Graphic添加到GraphicLayer中2023/2/23slide69JSAPI重要對象圖形(Graphic)InfoTemplate用于定義InfoWindow的標題和內容格式TITLE和CONTENT可以包含任何HTML可以使用${Attribute}來獲取graphic中的AttributevarinfoTemplate=newesri.InfoTemplate("${name}","名稱:${name}<br/>經度：${x}<br/>緯度：${y}");2023/2/23slide70JSAPI重要對象渲染器(Render)Render是一個以圖層為單位來改變符號的工具，而symbol改變符號是需要逐個設置的。2023/2/23slide71JSAPI重要對象要素集合(FeatureSet)相當于Geodatabase中的要素類，是Feature(要素)的集合FeatureSet中的每個Feature包括Geometry、屬性、symbol和一個InfoTemplate。如果FeatureSet不包含Geometry，只包含屬性，則可以將其看作一個表，其中每個Feature是一個行對象2023/2/23slide72JSAPI重要對象事件(Event)JSAPI是一種事件驅動的開發包，其中按照Dojo框架中的事件管理機制來實現，針對自定義的對象、控件提供了自定義的事件對象和一套觸發、回調的方法事件監聽方法：Dojo/_base/connect和on方法，其中on是推薦方法，不過考慮到兼容性，目前還支持Dojo的connect方法，以后可能會取消2023/2/23slide73JSAPI重要對象增加、刪除事件響應-On方式增加事件響應代碼：VarmyUnload=map.on(“unload”,unloadHandler);刪除事件響應代碼：myUnload.remove();2023/2/23slide74JSAPI重要對象增加、刪除事件響應-Connect方式增加事件響應代碼：VarmyUnload=connect.connect(map,“onUnload”,unloadHandler_connect);刪除事件響應代碼：connect.disconnect(myUnload_connect);2023/2/23slide759.7ArcGISAPIforJavaScript開發環境2023/2/23slide76開發環境2023/2/23slide77開發環境SetupaDevelopmentEnvironment

CodeAssistPlugins

2023/2/23slide78開發環境-VS2010

2023/2/23slide79開發環境-VS2010

2023/2/23slide80開發環境-VS2010

2023/2/23slide81開發環境-VS2010

2023/2/23slide82開發環境-VS2010

2023/2/23slide83開發環境-VS2010

2023/2/23slide84開發環境調試工具FirebugFirefox插件

2023/2/23slide85調試工具Firebug2023/2/23slide86調試工具Firebug2023/2/23slide87調試工具Firebug2023/2/23slide88調試工具Firebug2023/2/23slide89調試工具Firebug2023/2/23slide90調試工具Firebug2023/2/23slide91調試工具Firebug2023/2/23slide92調試工具Firebug2023/2/23slide93調試工具Firebug2023/2/23slide94調試工具Firebug2023/2/23slide95調試工具Firebug2023/2/23slide96調試工具Firebug控制臺（Console）是Firebug的第一個面板，也是最重要的面板，主要作用是顯示網頁加載過程中產生各類信息。Firebug內置一個console對象，提供5種方法，用來顯示信息。最簡單的方法是console.log()，可以用來取代alert()或document.write()。比如，在網頁腳本中使用console.log("HelloWorld")，加載時控制臺就會自動顯示如下內容。2023/2/23slide97調試工具Firebug2023/2/23slide98調試工具Firebug根據信息的不同性質，console對象還有4種顯示信息的方法，分別是一般信息()、除錯信息console.debug()、警告提示console.warn()、錯誤提示console.error

溫馨提示

  • 1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請聯系上傳者。文件的所有權益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙，網頁內容里面會有圖紙預覽，若沒有圖紙預覽就沒有圖紙。
  • 4. 未經權益所有人同意不得將文件中的內容挪作商業或盈利用途。
  • 5. 人人文庫網僅提供信息存儲空間，僅對用戶上傳內容的表現方式做保護處理，對用戶上傳分享的文檔內容本身不做任何修改或編輯，并不能對任何下載內容負責。
  • 6. 下載文件中如有侵權或不適當內容，請與我們聯系，我們立即糾正。
  • 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論