Question

使用ArcGIS JavaScript API 4.0，我想在单击列表项时更改ArcGIS webmap视图。

我想为extA，extB，extC等定义不同的范围。

我已经尝试过以下代码，但我无法得到它。

＆＃13;

    require([	
      "esri/views/MapView",
      "esri/WebMap",
      "esri/widgets/Compass",
	  "esri/widgets/Search",
	  "esri/widgets/BasemapToggle",
	  "esri/widgets/Home",
      "esri/layers/FeatureLayer",
	  "esri/geometry/Extent",
	  "esri/geometry/SpatialReference",
      "dojo/dom-construct",
      "dojo/domReady!"
    ], function(
      MapView, WebMap, Compass, Search, BasemapToggle, Home, FeatureLayer, Extent, SpatialReference, domConstruct
    ) {

	  
      var webmap = new WebMap({
        portalItem: { // autocasts as new PortalItem()
          id: "b3e185396c874f939265fcfc54d4909c"
        }
      });


      var view = new MapView({
        map: webmap,
        container: "viewDiv",
          extent: { // autocasts as new Extent()
            xmin: 29.00,
            ymin: 32.00,
            xmax: 42.00,
            ymax: 46.00,
            spatialReference: 4326
          }
      });

        document.getElementById("extA").addEventListener("click", function(){
			var extA = new Extent((25.77392578125, 38.03466796875, 31.300048828125, 42.9345703125, new SpatialReference({wkid:4326})), false);
			 var viewupd = new MapView({
				map: webmap,
				container: "viewDiv",
				extent: extA
			 });
			   view: viewupd
		});

＆＃13;

<html lang="en" class="no-js demo">
	<head>  

<link rel="stylesheet" href="https://js.arcgis.com/4.0/esri/css/main.css">
  <link rel="stylesheet" href="https://js.arcgis.com/4.0/esri/css/calcite/calcite.css">

  <script src="https://js.arcgis.com/4.0/"></script>
      
 </head>
  
  <body>
<div class="item">
   <div class="side">
      <ul class='menu'>
       <li id="extA"><a href="#">extent A</a></li>
       <li id="extB"><a href="#">extent B</a></li>
       <li id="extC"><a href="#">extent C</a></li>
       <li id="extD"><a href="#">extent D</a></li>
       <li id="extE"><a href="#">extent E</a></li>
      </ul>
	</div>
	<div class="side">
		<div id="viewDiv"></div>
	</div>
</div>

＆＃13;

https://developers.arcgis.com/javascript/latest/api-reference/esri-geometry-Extent.html

Answer 1

Use the .setExtent method，例如

var extA = new Extent((25.77392578125, 38.03466796875, 31.300048828125, 42.9345703125, new SpatialReference({wkid:4326})), false);
WebMap.setExtent(extA );

如何更改arcgis在线mapview范围

1 个答案: