底图切换.html

最新推荐文章于 2023-01-03 17:10:45 发布

学无止境慢慢来

最新推荐文章于 2023-01-03 17:10:45 发布

阅读量217

点赞数

分类专栏： arcgis_js_api_demo3.27

arcgis_js_api_demo3.27 专栏收录该内容

20 篇文章 0 订阅

订阅专栏

<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
    <title>底图切换</title>

    <link rel="stylesheet" href="https://js.arcgis.com/3.27/esri/css/esri.css">
    <script src="https://js.arcgis.com/3.27/"></script>
    <style>
        html, body, #map {
            padding:0;
            margin:0;
            height:100%;
        }
        #BasemapToggle {
            position: absolute;
            top: 20px;
            right: 20px;
            z-index: 50;
        }
    </style>
    <script>
        var map;
        require([
            "esri/map",
            "esri/dijit/BasemapToggle",
            "dojo/domReady!"
        ], function(
            Map, BasemapToggle
        )  {
            map = new Map("map", {
                center: [-70.6508, 43.1452],
                zoom: 16,
                basemap: "topo"
            });
            var toggle = new BasemapToggle({
                map: map,
                basemap: "satellite"
            }, "BasemapToggle");
            toggle.startup();
        });
    </script>
</head>

<body>
    <div id="map" class="map">
        <div id="BasemapToggle"></div>
    </div>
</body>
</html>