ArcGIS for JavaScript 4.8 离线API部署&入门demo

一:离线部署

  •  1.1 下载ArcGIS for JavaScript  4.8

    https://developers.arcgis.com/downloads/apis-and-sdks

下载解压得到arcgis_js_v48_api和arcgis_js_v48_sdk两个文件夹

1.2 文件移动

    1.2.3 移动arcgis_js_v48_sdk

             将arcgis_js_v48_sdk 文件夹拷贝到 C:\inetpub\wwwroot

1.2.4 移动library文件夹

    再将\arcgis_js_v48_api\arcgis_js_api\下的library文件夹拷贝到 C:\inetpub\wwwroot\arcgis_js_v48_sdk\arcgis_js_api

打开IIS管理器,查看部署信息

1.3 文件配置(init.js、dojo.js)

       1.3.1 init.js配置

        打开C:\inetpub\wwwroot\arcgis_js_v48_sdk\arcgis_js_api\library\4.8\init.js文件,查找[HOSTNAME_AND_PATH_TO_JSAPI]

      ★ https 协议修改为 http

      ★ [HOSTNAME_AND_PATH_TO_JSAPI] 修改为192.168.81.77/arcgis_js_v48_sdk/arcgis_js_api/library/4.8/  

           说明:192.168.81.77 为本机ip 或者将192.168.81.77 修改成localhost也可以。

                      即: localhost/arcgis_js_v48_sdk/arcgis_js_api/library/4.8/ 

                     建议使用本机ip,这样在同一个局域网下,其他电脑也可引用离线API。使用localhost则在只能本机引用本机部署的离线API.

修改前:

修改后如下图:

               

       1.3.2 dojo.js配置

      打开C:\inetpub\wwwroot\arcgis_js_v48_sdk\arcgis_js_api\library\4.8\dojo\dojo.js文件

      修改跟init.js操作一摸一样。

修改前:

修改后:

1.4 部署验证

浏览器输入 http://192.168.81.77/arcgis_js_v48_sdk/arcgis_js_api/library/4.8/init.js   如果能访问到文件信息,则说明离线api部署成功。(192.169.81.77 替换成你本机的ip)

  目录下 C:\inetpub\wwwroot\arcgis_js_v48_sdk\arcgis_js_api\library\4.8\****  任何文件

  通过 http://192.168.81.77/arcgis_js_v48_sdk/arcgis_js_api/library/4.8/***** 都能在浏览器中访问

   

 

二:创建第一个arcgis demo

   新建index.html文件

<!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
        {
            height: 100%;
            width: 100%;
            margin: 0;
            padding: 0;
        }
        body
        {
            background-color: #FFF;
            overflow: hidden;
            font-family: "Trebuchet MS";
        }
    </style>
    <!--<link rel="stylesheet" href="http://192.168.81.77/arcgis_js_v48_sdk/arcgis_js_api/library/4.8/dijit/themes/claro/claro.css" />
    <link rel="stylesheet" href="http://192.168.81.77/arcgis_js_v48_sdk/arcgis_js_api/library/4.8/dijit/themes/tundra/tundra.css" />-->
    <link rel="stylesheet" type="text/css" href="http://192.168.81.77/arcgis_js_v48_sdk/arcgis_js_api/library/4.8/esri/css/main.css" />
    <!--<script type="text/javascript" src="http://192.168.81.77/arcgis_js_v48_sdk/arcgis_js_api/library/4.8/dojo/dojo.js"></script>-->
    <script type="text/javascript" src="http://192.168.81.77/arcgis_js_v48_sdk/arcgis_js_api/library/4.8/init.js"></script>
    <script>
        var map;
        require(["esri/map",
                 "esri/views/MapView",
                 "dojo/domReady!"
            ], function (Map,MapView) {
            map = new Map({
                basemap: "topo",
            });

            var view = new MapView({
                container: "mapDiv",
                map: map,
                zoom: 10,//放大量,数字越大则为地图放大多少倍
                center: [117.196646,31.827314] //设置初始经纬度
            });
        });
    </script>
</head>
<body class="">
    <div id="mapDiv"></div>
</body>
</html>

 注意:引入离线部署的文件时,ip要换成你部署机器的ip

<link rel="stylesheet" type="text/css" href="http://192.168.81.77/arcgis_js_v48_sdk/arcgis_js_api/library/4.8/esri/css/main.css" />
<script type="text/javascript" src="http://192.168.81.77/arcgis_js_v48_sdk/arcgis_js_api/library/4.8/init.js"></script>

浏览器打开index.html文件,能看到地图,恭喜你 成功了!

如果地图无法展示,浏览器F12 打开,查看js和css文件是否引入正常。

 

  • 2
    点赞
  • 10
    收藏
    觉得还不错? 一键收藏
  • 9
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 9
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值