<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no"/> <title>widgets_basemapToggle</title> <!--<link rel="stylesheet" href="https://js.arcgis.com/4.11/esri/themes/light/main.css"/>--> <!--<script src="https://js.arcgis.com/4.11/"></script>--> <!--我的接口。--> <link rel="stylesheet" href="http://localhost:8080/arcgis_js_v411_api/arcgis_js_api/library/4.11/esri/themes/light/main.css"> <script src="http://localhost:8080/arcgis_js_v411_api/arcgis_js_api/library/4.11/dojo/dojo.js"></script> <style> html, body, #viewDiv { padding: 0; margin: 0; height: 100%; width: 100%; } </style> <script> require([ "esri/Map", "esri/views/MapView", "esri/widgets/BasemapToggle" ], function(Map, MapView, BasemapToggle) { var map = new Map({ basemap: "topo" }); var view = new MapView({ container: "viewDiv", map: map, center: [116.397245, 39.900930], zoom: 4 }); // 1 - 创建小部件。 var toggle = new BasemapToggle({ // 2 - 设置属性。 view: view, // 视图,该视图提供对地图的“topo”底图的访问。 nextBasemap: "hybrid" // 允许切换到'hybrid'底图。 }); // 将小部件添加到视图的右上角。 view.ui.add(toggle, "top-right"); }); </script> </head> <body> <div id="viewDiv"></div> </body> </html>
widgets_basemapToggle.html
最新推荐文章于 2024-02-08 18:14:33 发布