ArcGIS Server JavaScript API實戰(一)

最後更新：2018-12-05 來源：互聯網

上載者：User

創建阿里雲帳戶，並獲得超過 40 款產品的免費試用版；而企業帳戶則可以享有總值 $1200 的免費試用版。立即註冊！

前一篇文章簡單的介紹了一下如何使用arcgis server來發布地圖，接著談使用ArcGIS Server JavaScript API來操作顯示地圖。

由於arcgis server是才剛在在9.3版本推出 JavaScript API,目前唯一可供參考的資料就是esri提供的文檔。在閱讀之前建議先去esri的網站查看一下文檔，裡面提供了大量的樣本和說明，是初學者的最佳去處，本文也是在此基礎之上完成的。該文檔目前不提供下載，僅供線上閱覽。

http://resources.esri.com/help/9.3/arcgisserver/apis/javascript/arcgis/help/jshelp_start.htm

前面的文章中主要談了地圖的顯示，這裡主要談其中遇到的問題。

據我目前所知，使用ArcGIS Server JavaScript API來顯示地圖的話，必須連網。

在如下html頁面中，我們來顯示一幅地圖，利用的是本地的arcgis server服務：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>Create a Map</title>
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/1.1/js/dojo/dijit/themes/tundra/tundra.css">
    <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=1.1"></script>
    <script type="text/javascript">
      dojo.require("esri.map");
      function init() {
        var myMap = new esri.Map("mapDiv");
        var dynamicMapServiceLayer = new esri.layers.ArcGISDynamicMapServiceLayer("http://rzf:8399/arcgis/rest/services/test_2/MapServer");
        myMap.addLayer(dynamicMapServiceLayer);
      }

      dojo.addOnLoad(init);
    </script>
  </head>
  <body class="tundra">
    <div id="mapDiv" style="width:900px; height:600px; border:1px solid #000;"></div>

    <h4>Work flow:</h4>
    <ul>
    <li>Create a map.</li>
    <li>Add an ArcGISTiledMapServiceLayer.</li>
    </ul>
  </body>
</html>

其效果如下：
注意看其中的兩行：
<link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/1.1/js/dojo/dijit/themes/tundra/tundra.css">
<script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=1.1"></script>
這是要到esri的網站去開啟兩個檔案，很顯然，如果網路不通的話，地圖將無法顯示。

因此，我自己先將這兩個檔案down下來，儲存到本地，起名為default.js和tundra.css，然後像引用普通js，css檔案一樣引用它們：
<link rel="stylesheet" type="text/css" href="tundra.css">
<script type="text/javascript" src="default.js"></script>
這樣和前面的效果一樣，但是地圖顯示速度應該稍微快點，特別是在網路比較慢的時候。

如此一來，好像解決了問題，但是經過我實踐，還是沒能徹底搞定：在斷網或網路不穩定的時候，照樣無法顯示地圖。
原因在這裡：
開啟剛才下載的default.js檔案，可以看到裡面有這麼一句：esriConfig={baseUrl:"http://serverapi.arcgisonline.com/jsapi/arcgis/1/"
它還是要到esri網站去下檔案，如此一來，就前功盡棄了！
怎麼辦？
繼續像向前面一樣，把檔案都下下來？
然而遺憾的是，當我嘗試開啟http://serverapi.arcgisonline.com/jsapi/arcgis/1/來下檔案時，頁面顯示：
Directory Listing Denied
This Virtual Directory does not allow contents to be listed.
這隻是一個目錄而已，真正要用的檔案的地址還沒出來。
繼續查看default.js檔案，發現這正的檔案地址都隱藏在裡面，如：
esriDijitConfig={infoWindow:{templatePath:esriConfig.baseUrl+"js/esri/dijit/templates/InfoWindow.html"
實際地址就是：http://serverapi.arcgisonline.com/jsapi/arcgis/1/js/esri/dijit/templates/InfoWindow.html

現在可以開啟，儲存這個檔案了。

但是，default.js裡到底引用了多少檔案？它們的地址又是多少？難道就這樣一個一個去查？

看了一眼default.js檔案，我就放棄這種想法了：代碼都是一行到底，從不分行，查看十分不方便----這分明就是esri不想讓我們看這個檔案，這樣閱讀都難，還怎麼去分析它，還怎麼去找出那些url?！

事已至此，就只好放棄了。

其實真不明白esri怎麼想的，難道要我們用 JavaScript API的時候都保證網路暢通？它把這些檔案提供給我們有什麼難的嗎？同樣的網路環境下，adf就可以正常顯示，看來這個剛推出的JavaScript API方式還得慢慢完善了。

我們試目以待。

本文章原先以中文撰寫並發佈於 aliyun.com，亦設英文版本，僅作資訊用途。本網站不對文章的準確性，完整性或可靠性或其任何翻譯作出任何明示或暗示的陳述或保證。如對該文章有任何疑慮或投訴，請傳送電郵至 info-contact@alibabacloud.com 並提供相關疑慮或投訴的詳細說明。職員會於 5 個工作天內與您聯絡，一經驗證之後，即會刪除該侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

Sales Support

1 on 1 presale consultation

Chat Contact Sales
After-Sales Support

24/7 Technical Support 6 Free Tickets per Quarter Faster Response

Open a Ticket
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

Learn More