专题图加载

<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
    <title>ArcGIS JavaScript Tutorials: Select a basemap</title>
    <style>
        /*设置显示区域的样式，地图全页面展示*/
         html, body, #viewDiv {
             padding: 0;
             margin: 0;
             height: 100%;
             width: 100%;
         }
    </style>

    <!--第一步：引入js文件和css样式表，本文使用了4.13版本-->
    <link rel="stylesheet" href="http://localhost/arcgis_js_v413_api/4.13/esri/css/main.css" />
    <script type="text/javascript" src="http://localhost/arcgis_js_v413_api/4.13/init.js"></script>

    <!--开始使用编辑js，实现加载地图效果-->
    <script>
        //第二步，导入需要的模块，这里引入了Map、MapView、Compass、MapImageLayer
        require([
            "esri/Map",
            "esri/views/MapView",
            "esri/widgets/Compass",
            "esri/layers/MapImageLayer"
        ], function (Map, MapView, Compass, MapImageLayer) {

            //第三步，初始化一个地图图层
            var layer0 = new MapImageLayer({
                url: "URL0"
            });
            var layer1 = new MapImageLayer({
                url: "URL1"
            });

            //第四步，初始化一个地图对象
            var map = new Map();
            map.add(layer0);
            map.add(layer1);

            // 新建视图，用的是MapView，是2D的，3D的要用SceneView模块，SceneView方法创建。
            var view = new MapView({
                //显示在HTML上的区域，也就是哪个div里
                container: "viewDiv",
                //将地图服务加载到视图上，这是4.x版本设定，3.x版本可直接创建map时设定
                map: map,
                //设置加载地图的缩放等级和中心位置。
                center: [115.80543, 36.02700],　　// longitude, latitude
                zoom: 6
            });
            var compassWidget = new Compass({ view: view });
            view.ui.add(compassWidget, "top-left");
        });
    </script>

</head>
<body>
    <div id="viewDiv"></div>
</body>
</html>
猜你喜欢
