点击按钮切换底图

最新推荐文章于 2021-08-21 09:19:41 发布

AriaGIS

最新推荐文章于 2021-08-21 09:19:41 发布

阅读量358

点赞数 2

分类专栏： ArcGIS API for JavaScript 文章标签： arcgisapi

本文链接：https://blog.csdn.net/weixin_44616652/article/details/109295223

版权

ArcGIS API for JavaScript 专栏收录该内容

28 篇文章 8 订阅

订阅专栏

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" />
    <title>Intro to layers | Sample | ArcGIS API for JavaScript 4.17</title>

    <link rel="stylesheet" href="https://js.arcgis.com/4.17/esri/themes/light/main.css" />
    <script src="https://js.arcgis.com/4.17/"></script>

    <style>
        html,
        body,
        #viewDiv {
            padding: 0;
            margin: 0;
            height: 100%;
            width: 100%;
        }

        #layerToggle {
            top: 20px;
            right: 20px;
            position: absolute;
            z-index: 99;
            background-color: white;
            border-radius: 8px;
            padding: 10px;
            opacity: 0.75;
        }
    </style>

    <script>
        require([
            "esri/Map",
            "esri/views/SceneView",
            "esri/layers/TileLayer", "dojo/dom",
            "dojo/on",
            "dojo/domReady!"
        ], function (Map, SceneView, TileLayer, dom, on) {
            url1 = "http://map.geoq.cn/arcgis/rest/services/ChinaOnlineStreetPurplishBlue/MapServer";
            url2 = "http://map.geoq.cn/arcgis/rest/services/ChinaOnlineCommunityENG/MapServer";
            var Layer1 = new TileLayer({
                url: url1
            });
            var Layer2 = new TileLayer({
                url: url2
            });
            var map = new Map();
            var view = new SceneView({
                container: "viewDiv",
                map: map
            });
            on(dom.byId("btn1"), "click", btn1);
            on(dom.byId("btn2"), "click", btn2);
            function btn1() {
                map.remove(Layer2);
                map.add(Layer1)
            }
            function btn2() {
                map.remove(Layer1);
                map.add(Layer2)
            }
        });
    </script>
</head>

<body>
    <div id="viewDiv">

        <span id="layerToggle" class="esri-widget">
            <button id="btn1">btn1</button>
            <button id="btn2">btn2</button>
        </span>


    </div>

</body>

</html>

AriaGIS

关注

2
点赞
踩
3

收藏

觉得还不错? 一键收藏
5
评论
点击按钮切换底图

<!DOCTYPE html><html><head> <meta charset="utf-8" /> <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" /> <title>Intro to layers | Sample | ArcGIS API for JavaScript 4....
复制链接

扫一扫

专栏目录