ArcGIS API for JavaScript 開発環境の構築と最初のデモ例-jsチュートリアル-php.cn

ArcGIS API for JavaScript 開発環境の構築と最初のデモ例

黄舟

リリース： 2017-03-30 16:30:18

オリジナル

2946 人が閲覧しました

ESRI はこれまでに、より豊富で強力な機能を提供する最新の ArcGIS Server for JavaScript API v3.9 をリリースしました。

1. インストール前の準備

1. ArcGIS Server for JavaScript API の各バージョンのダウンロードアドレス: http://support.esrichina-bj.cn/2011/0223/960.html、最新のものをダウンロードすることを選択します。「ArcGIS API for JavaScript 3.9: Library | SDK」、以下の図に示すように:

ArcGIS API for JavaScript 開発環境の構築と最初のデモ例

2. ローカルエリアにダウンロードされたファイルは、以下の図に示すようになります:

ArcGIS API for JavaScript 開発環境の構築と最初のデモ例

3. 解凍します。以下の図に示すように、上記の 2 つの zip 圧縮パッケージ:

ArcGIS API for JavaScript 開発環境の構築と最初のデモ例

4. IIS がローカルにインストールされていることを確認してください。そうでない場合は、次のアドレスを参照して設定してください。 baidu.com/article/8275fc8694360146a03cf6c3.html

2. API と SDK のローカル IIS 構成の展開

1. C:Inetpubwwwroot フォルダーを開きます。

2. arcgis_js_v39_sdk フォルダーを C:Inetpubwwwroot に直接コピーし、以下に示すように C:Inetpubwwwrootarcgis_js_v39_sdk に変更します。

3. arcgis_js_v39_apiarc を変更します。 gis_js_ 内のライブラリフォルダーをコピーします。 api ディレクトリを

ArcGIS API for JavaScript 開発環境の構築と最初のデモ例 C: inetpubwwwrootarcgis_js_v39_sdkarcgis_js_api に移動し、以下に示すように、

C:inetpubwwwrootarcgis_js_v39_sdkarcgis_js_apilibrary になります:

4. 以下の図に示すように IIS を開き、install.ht m を参照して、初期展開が成功したことを示します。

ArcGIS API for JavaScript 開発環境の構築と最初のデモ例

5. C:inetpubwwwrootarcgis_js_v39_sdkarcgis_js_apilibrary3.93.9init.js ファイルを見つけて、メモ帳または Ctrl+F キーの組み合わせで開き、[HOSTNAME_AND_PATH_TO_JSAPI] を見つけて & に置き換えます。 lt;myserver>/arcgis _js_v39_sdk /arcgis_js_api/library/3.9/ 3.9/、はマシン名またはマシン IP です。http プレフィックスがないことに注意してください。以下の図に示すように、ここでは localhost または 192.168.11.195 を使用します。 6. C:inetpubwwwrootarcgis_js_v39_sdkarcgis_js_apilibrary3.93.9jsdojodojodojo.js を見つけます。ファイルを開き、メモ帳または EditPlus を開きます。 Ctrl+F キーの組み合わせで [HOSTNAME_AND_PATH_TO_JSAPI] を検索し、/arcgis_js_v39_sdk/arcgis_js_api/library/3.9/3.9/ に置き換えます。ここで、は http プレフィックスを除いたマシン名またはマシン IP です。ここでは、下の図に示すように、localhost または 192.168.11.195 を使用します。

ArcGIS API for JavaScript 開発環境の構築と最初のデモ例

7. 下の図に示すように、3.9compact フォルダーを見つけて、8 を見つけます。 )、9) ステップ 5) と 6) の操作は、図に示すように、操作 8) と 9) が 3.9compact フォルダーに対するものであり、操作 5) と 6) が 3.9 フォルダーに対するものであることを除いて、まったく同じです。下の図:

ArcGIS API for JavaScript 開発環境の構築と最初のデモ例

8. C:inetpubwwwrootarcgis_js_v39_sdkarcgis_js_apilibrary3.93.9compactinit.js ファイルを開き、Ctrl+F キーの組み合わせで [HOSTNAME_AND_PATH_TO_JSAPI] を見つけます。これを / に置き換えます。 arcgis_js_v39_sd k/arcgis_js_api/library/3.9/3.9compact/, は、http プレフィックスがないことに注意してください。以下の図に示すように、ここでは localhost または 192.168.11.195 を使用します。

ArcGIS API for JavaScript 開発環境の構築と最初のデモ例

9. C:inetpubwwwrootarcgis_js_v39_sdkarcgis_js_apilibrary3.93.9compactjsdojodojodojo.js ファイルを見つけ、メモ帳または EditPlus を使用して開き、Ctrl+F キーの組み合わせで [HOSTNAME_AND_PATH_TO_JSAPI] を見つけ、は http プレフィックスを除いたマシン名またはマシン IP です。以下の図に示すように、localhost または 192.168.11.195 を使用します。

ArcGIS API for JavaScript 開発環境の構築と最初のデモ例

10 上記の 9 つの手順を完了すると、ArcGIS API for JavaScript のローカル配置が完了しました。

3. サンプルデモを実行します

1. VS2012 を開き、新しい空の Web プロジェクトを作成し、index.html ファイルを追加します。ファイルの内容は次のとおりです。

ArcGIS API for JavaScript 開発環境の構築と最初のデモ例

CSSここで使用されるおよび js ファイル。これらはすべて、前の手順で構成されたローカルサーバー上のパスです。

<!DOCTYPE html>  
<html xmlns="http://www.w3.org/1999/xhtml">  
<head>  
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
    <title>第一个js GIS地图</title>  
    <style>  
        html, body, #mapDiv {  
            padding: 0;  
            margin: 0;  
            height: 100%;  
        }  
    </style>  
    <link rel="stylesheet" type="text/css" href="http://localhost/arcgis_js_v39_sdk/arcgis_js_api/library/3.9/3.9/js/dojo/dijit/themes/tundra/tundra.css" />  
    <link rel="stylesheet" type="text/css" href="http://localhost/arcgis_js_v39_sdk/arcgis_js_api/library/3.9/3.9/js/esri/css/esri.css" />  
    <script type="text/javascript" src="http://localhost/arcgis_js_v39_sdk/arcgis_js_api/library/3.9/3.9/init.js"></script>  
    <script type="text/javascript">  
        dojo.require("esri.map");  
        function init() {  
            var myMap = new esri.Map("mapDiv");  
            var myTiledMapServiceLayer = new esri.layers.ArcGISTiledMapServiceLayer(
            "http://cache1.arcgisonline.cn/ArcGIS/rest/services/ChinaOnlineCommunityENG/MapServer");  
            myMap.addLayer(myTiledMapServiceLayer);  
        }  
        dojo.addOnLoad(init);  
    </script>  
</head>  
<body class="claro">  
    <p id="mapDiv" style="width: 900px; height: 600px; border: 1px solid #000;"></p>  
</body>  
</html>

ログイン後にコピー

2. 以下に示すように、index.html ページを実行します。

ArcGIS API for JavaScript 開発環境の構築と最初のデモ例