建立Web地圖應用工程
1. 建立一個新的ArcGIS Server工程. 從Eclipse主菜單選擇File>New>Project，導航到ESRI Templates>Server，選擇ArcGIS Server Project. 點擊Next.
2. 輸入AgsSimple作為工程名，從target runtime選擇一個Web容器.
3. 輸入正確的GIS server伺服器名，使用者名稱，密碼和域. 點擊Connect按鈕就可以看到server objects出現在左下列表中。點擊選擇前面建立的usa服務。點擊Finish就產生了一個地圖Web應用。
Eclipse IDE利用模版為我們產生了一個相對複雜的地圖Web應用。對於這個例子，我們並不需要太複雜的功能，所以只要兩個檔案：WEB-INF目錄下的faces-config.xml和Web應用根目錄下的map.jsp。faces-config.xml檔案是用來串連Web ADF架構架構的業務對象，暴露這些對象給視圖/Web層，為應用指定適當的GIS servers，以及提供鑒權資訊. Map.jsp包含用於渲染地圖應用的JSP標籤, 如地圖、目錄(TOC)、以及地圖工具. 而用於建立這些視圖的資料又反過來綁定在faces-config.xml指定的資料來源中。
Web控制項和Managed-bean
在Web ADF應用中使用了好幾種Web控制項，有些是可見的如map和tools Web控制項，有些不可見比如context control。在使用這些控制項之前必須在Web ADF應用中配置好。Web控制項配置涉及幾個檔案：
•context-attributes.xml
•ags-functionalities.xml
•face-config.xml
context-attributes.xml: 在context-attributes.xml中， 建立了一個名為map" 的 managed-bean，它是你在同一個應用中看到的地圖Web控制項的邏輯表示。這個managed-bean建立後，你還需要為它設定一些屬性。比如你可以設定一個地圖managed-bean的"imageFormat" 屬性為 "PNG"。
context-attributes.xml：
<managed-bean>
<managed-bean-name>map</managed-bean-name>
<managed-bean-class>com.esri.adf.web.data.WebMap</managed-bean-class>
<managed-bean-scope>none</managed-bean-scope>
<managed-property>
<property-name>imageFormat</property-name>
<value>PNG</value>
</managed-property>
</managed-bean>
這個簡單的應用只有一個map控制項，所以只有一個map控制項的managed-bean需要建立。如果你需要加像"Toc" 和 "overview" 的控制項，你還要建立這些anaged-beans於context-attributes.xml中。
ags-functionalities.xml: 在ags-functionalities.xml中，建立了ArcGIS Server的不同功能的managed-beans：
agsMap: 代表map控制項的地圖功能的managed-bean
agsToc: 代表toc控制項的toc功能的managed-bean
agsOverview: 代表overview控制項的overview功能的managed-bean
ags-functionalities.xml：
<managed-bean>
<managed-bean-name>agsMap</managed-bean-name>
<managed-bean-class>com.esri.adf.web.ags.data.AGSMapFunctionality</managed-bean-class>
<managed-bean-scope>none</managed-bean-scope>
</managed-bean>
<managed-bean>
<managed-bean-name>agsToc</managed-bean-name>
<managed-bean-class>com.esri.adf.web.ags.data.AGSTocFunctionality</managed-bean-class>
<managed-bean-scope>none</managed-bean-scope>
</managed-bean>
<managed-bean>
<managed-bean-name>agsOverview</managed-bean-name>
<managed-bean-class>com.esri.adf.web.ags.data.AGSOverviewFunctionality</managed-bean-class>
<managed-bean-scope>none</managed-bean-scope>
</managed-bean>
一旦一個functionality managed-bean建立並添加到resource managed-bean的屬性，該就可以在Web ADF應用中使用了。在本例子中，只有添加了map functionality作為map resource的屬性。更多的functionalitie，像query， geocode， 和history可以建立並添加到map resource中。
faces-config.xml: 在faces-config.xml中，定義了四個managed bean： "esriWebApplication", "esriWebSession", "ags1", "mapContext".
"ags1" 代表你在Web應用中欲發布的GIS資料來源。在這個例子中就是ArcGIS Server。定義在ags-functionalities.xml的functionality添加到map resource的屬性列表中。
"esriWebApplication" 在ADF web應用中總被設定成application層級的managed-bean。
"esriWebSession" 該managed-bean持有"esriWebApplication"作為屬性。
"mapContext" 該managed-bean是"context" 控制項的邏輯代表並且持有"esriWebSession" 和"map" 作為它的屬性.
對任何Web ADF應用，後三個managed-bean是必要的，特別是 "mapContext"，它像hub一樣串連和協調其他ADF組件。這也是把一個"map" 作為它的屬性和"ags1" 作為它的resource。
faces-config.xml：
<managed-bean>
<managed-bean-name>esriWebApplication</managed-bean-name>
<managed-bean-class>com.esri.adf.web.data.WebApplication</managed-bean-class>
<managed-bean-scope>application</managed-bean-scope>
</managed-bean>
<managed-bean>
<managed-bean-name>esriWebSession</managed-bean-name>
<managed-bean-class>com.esri.adf.web.data.WebSession</managed-bean-class>
<managed-bean-scope>session</managed-bean-scope>
<managed-property>
<property-name>webApplication</property-name>
<value>#{esriWebApplication}</value>
</managed-property>
</managed-bean>
<managed-bean>
<managed-bean-name>mapContext</managed-bean-name>
<managed-bean-class>com.esri.adf.web.data.WebContext</managed-bean-class>
<managed-bean-scope>session</managed-bean-scope>
<managed-property>
<property-name>webSession</property-name>
<value>#{esriWebSession}</value>
</managed-property>
<managed-property>
<property-name>attributes</property-name>
<map-entries>
<map-entry>
<key>map</key>
<value>#{map}</value>
</map-entry>
</map-entries>
</managed-property>
<managed-property>
<property-name>resources</property-name>
<map-entries>
<map-entry>
<key>ags1</key>
<value>#{ags1}</value>
</map-entry>
</map-entries>
</managed-property>
</managed-bean>
<managed-bean>
<managed-bean-name>ags1</managed-bean-name>
<managed-bean-class>com.esri.adf.web.ags.data.AGSMapResource</managed-bean-class>
<managed-bean-scope>none</managed-bean-scope>
<managed-property>
<property-name>user</property-name>
<value>#{agsUser1}</value>
</managed-property>
<managed-property>
<property-name>serverObjectName</property-name>
<value>usa</value>
</managed-property>
<managed-property>
<property-name>hosts</property-name>
<list-entries>
<value>YourServer</value>
</list-entries>
</managed-property>
<managed-property>
<property-name>functionalities</property-name>
<map-entries>
<map-entry>
<key>map</key>
<value>#{agsMap}</value>
</map-entry>
<map-entry>
<key>overview</key>
<value>#{agsOverview}</value>
</map-entry>
</map-entries>
</managed-property>
</managed-bean>
一旦這些managed-bean在context-attribute.xml，ags-functionalities.xml 和faces-config.xml適當配置好了，你可以容易地在ADF Web應用的JSP頁面中以JSP標籤方式添加Web控制項。
編寫JSP頁面
本例子只有一個頁面map.jsp。 該頁面相對簡單：它只顯示一張地圖，允許使用者放大、縮小、放大到全部。
命令和工具
<a:toolbar>標籤為應用的工具和命令提供容器。工具列只在JSP頁面指定，faces-config.xml中沒有工具列的聲明。你必須用控制項的ID關聯工具列和地圖，你可以可選地設定當前工具。
命令是一個觸發服務端動作而不需要進一步地用戶端互動地JSP頁面元素。命令的一個例子是"放大到全部" 按鈕。使用者一點擊該按鈕，服務端就執行一個方法。工具在執行一個服務端方法前需要進一步的用戶端互動。工具的一個例子是"框選放大"。使用者一點擊按鈕，還要在地圖上拖拽一個方框表示欲放大的地區，然後服務端的方法才執行。地圖和工具的互動是工具列比促指定它的關聯地圖的原因。
工具列的前兩個元素是放大和縮小。這兩個標籤有兩個重要屬性：clientAction和serverAction。clientAction屬性指定了哪個javascript 函數和工具關聯，serverAction屬性指定了服務端哪個類被調用當用戶端動作結束.。對於第一個工具。當使用者點擊放大放大按鈕，瀏覽器執行一個叫MapDragRectangle的javascript函數。使用者在地圖Map0上畫一個方框後，表單提交到伺服器，伺服器調用ZoomInToolAction類。 這個類的執行方法會被調用，javascript的輸出將作為該方法的MapEvent參數。
下一個標籤是命令標籤，用於純服務端處理。本例子使用一個ZoomFullExtentListener使地圖放大到全部。命令標籤是JSF命令標籤的擴充。當使用者點擊命令的按鈕後，服務端調用ZoomFullExtentListener類的processAction方法。
最後一個 Web ADF 標籤是地表徵圖簽，該標籤在頁面上渲染一張地圖，它的ID用來在頁面裡標識該地圖，比如和工具列的關聯。你可以通過標籤屬性控制一些地圖的屬性，比如尺寸，工具拉框顏色，邊框以及使用哪個XSL。
小結
ADF的managed-bean之間的關係圖：
mapContext(WebContext)
|
+esriWebSession(WebSession)
| |
| +esriWebApplication(WebApplication)
|
+attributes
| |
| +map(WebMap)
| +toc(WebToc)
| +...
|
+resources
|
+ags1(AGSMapResource)
|
+agsUser1
|
+serverObjectName
|
+hosts
|
+functionalities
|
+agsMap(AGSMapFunctionality)
+agsToc(AGSTocFunctionality)
+agsOverview(AGSOverviewFunctionality)
+...
建立地圖Web應用的步驟：
1. 聲明ArcGIS Server的MapServer object作為GISResource
2. 關聯AGSMapFunctionality和GISResource
3. 聲明WebMap來使用functionality
4. 關聯WebMap和context，確保它參與Web ADF架構
5. 在jsp頁面寫適當的jsp標籤
