首頁 > 開發者 > JavaScript
有關於 ArcGIS Server JavaScript API 一些概念性質的東西在這裡不羅嗦了，直接進入主題，如何利用 ArcGIS Server JavaScript API 開發互動性強的webgis 的一點思路。
如果你熟悉GeoServer + openlayer，或者是大名鼎鼎的google api，抑或是baidu api，相信你會對學習 ArcGIS Server JavaScript API 遊刃有餘，其實它們的原理都差不多，都是在用戶端調用地圖服務。。。當然這是題外話。
學習一門技術最有效方法就是看官方的協助，這裡有兩個資源非常值得參考。
第一就是 API 參考，我想沒有一個人能離開 API 而寫出複雜的 webgis 代碼出來，隨時查看並總結無疑對我們開發 webgis 是一劑良方。
其網址為：http://resources.esri.com/help/9.3/arcgisserver/apis/javascript/arcgis/help/jsapi_start.htm
第二就是查看 ESRI 官方為我們提供的幾個值得參考的例子程式，個人覺得非常有參考價值，幾乎涵蓋了所有的 API ，一些例子甚至可以直接 copy。
其網址為：http://resources.esri.com/help/9.3/arcgisserver/apis/javascript/arcgis/help/jssamples_start.htm
下面以自己的理解（也有可能理解有出入）簡單敘述下 API 的結構。
為 ESRI 官方截屏，包含了所有的 JavaScript API。
其實 JavaScript 中並沒有類似 Java 中包的概念，也沒有類似 .NET 中類似命名空間的概念，但考慮到 JavaScript 的所有對象都有自己的屬性，屬性又可以包含對象，這樣就能創造一些和其他語言裡面的命名空間神似的東西了，詳見本人博文《JavaScript中的命名空間 》，ArcGIS Server JavaScript API 正是藉助於 Dojo 並基於這種思想建立起來的。
下面說說各個命名空間下的對象（不同於 Java 和 .net 中的對象，相當於是 Java 和 .net 中的類）作用。
1，esri 命名空間
所有的對象都是在 esri 命名空間下的，esri 有自己的屬性和方法。
如 esri.version 返回當前 JavaScript API 的版本號碼。esri.hide(Element) 隱藏 html 元素，像 DIV 或者是 TABLE 元素。
2，Graphic 對象
如果你做過 arcserver adf 開發或者是 arcserver api for Silverlight 開發的話，對 Graphic 對象應該是很熟悉的。這是一個表示存在於記憶體中的映像，當我們需要高亮顯示我們查詢出來的地圖時，就要用到這個對象。
3，InfoTemplate 對象
從英文意思上看我們就知道這是一個資訊模板對象，是一個包含標題和用來把 Graphic.attributes 屬性轉化為 html 表現方式的內容範本字串。
4，Map 對象
這是任何一個 webgis 都必須要用到的對象，能夠用來載入地圖，對地圖進行各種操作。
5，SpatialReference 對象
空間參考對象。
6，Units 對象
單位對象。
7，dijits 命名空間
我們知道 dojo 中有一個 dijit 包，它裡面是有關一些頁面配置和 html 控制項的內容。
esri 中的 dijits 命名空間下面同樣是有 html 控制項存在的，不過這隻是 esri 自己定製的控制項而已，該控制項為 InfoWindow ，顧名思義，這個對象是可以用來顯示資訊的視窗，就像是案頭產品的快顯視窗一樣。
8，geometry 命名空間
該命名空間包含了一些地理幾何類型，如 Point，Polyline，Polygon 等對象。
9，layers 命名空間
該命名空間包含了各種圖層類型的對象，如 ArcGISDynamicMapServiceLayer，ArcGISImageServiceLayer 和 ArcGISTiledMapServiceLayer等對象。
10，render 命名空間
該命名空間包含了有關於渲染的一些對象，如 ClassBreakRenderer，SimpleRenderer 和 UniqueValueRenderer等對象。
11，symbol 命名空間
該命名空間包含了有關於點、線、面等樣式的一些對象，如 SimpleMarkerSymbol、SimpleLineSymbol 和 SimpleFillSymbol 等對象。
12，tasks 命名空間
該命名空間包含了一些有關任務的對象，如 FindTask、QueryTask 和 RouteTask 等對象。
13，toolbars 命名空間
該命名空間包含了工具列的一些對象，如 Draw 和 Navigition。
14，vitrualearth 命名空間
該命名空間包含了一些與微軟的 Bing Map 有關的一些對象，如 VEAddress，VEGeocoder 和 VETileLayer 等對象。
以下面的例子做一個測試，下面的代碼可以直接用記事本編輯。
代碼 <html>
map = new esri.Map("mapDiv");//執行個體化地圖控制項
dojo.connect(map,"onMouseMove",showCoordinates);//註冊事件，注意事件名大小寫敏感
dojo.connect(map,"onMouseDrag",showCoordinates);
myTiledMapServiceLayer = new esri.layers.ArcGISTiledMapServiceLayer
("http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer");//執行個體化地圖服務
map.addLayer(myTiledMapServiceLayer);//添加地圖
}
function showCoordinates(evt)//顯示地圖座標
{
var mp = evt.mapPoint;
dojo.byId("info").innerHTML ="座標：" + mp.x + " , " + mp.y;
}
dojo.addOnLoad(init);
</script>
</head>
<body>
<div style="width:100%;height:100%;text-align:center;">
<div id="mapDiv" class="tundra" style="border:solid 1px red;width:1200px;height:800px;margin-
left:auto;margin:0 auto;position:relative;">
<div style="position:absolute;margin:100px;z-index:10000">
<img src="./images/arrow_up_fat.bmp" onclick="map.panUp();"></img><br/>
<img src="./images/arrow_left_fat.bmp" onclick="map.panLeft();"></img>
<img src="./images/arrow_right_fat.bmp" onclick="map.panRight();"></img><br/>
<img src="./images/arrow_down_fat.bmp" onclick="map.panDown();"></img>
</div>
</div>
<div id="info" style="width:1200px;border:solid 1px blue;"></div>
</div>
</body>
</html>
如下：
注意，如果遇到不能正常顯示中文的話，將該 html 檔案用記事本開啟，然後另存新檔 utf-8 格式的文本，再將文本的尾碼名修改為 .html，這樣就能正常顯示中文了。
這隻是一個起步，JavaScript API 中涉及的東西很多，也很豐富，只要有思路，借鑒執行個體程式和查看 API 協助，盡情發揮你的想象，做一個完美的 webgis 系統也不是什麼難事。。。
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
