设置和使用地图的范围—ArcGIS API for JavaScript

设置地图的范围或获得地图范围是使用地图时常见操作。在地图上设置新范围的一个简单的替代方法是在地图上调用centerAndZoom()法，该方法基于给定的中心点和缩放级别设置新的范围。

默认范围
如果在初始化地图时不包含范围信息，则默认范围是地图服务初始范围，就是上次保存在地图文档中的地图范围。如果你使用多个服务，默认范围是添加的基本映射或第一个加载图层的初始范围。

设置初始范围
如果你希望起始范围不是默认的范围，你可以通过以下方法设置初始范围：
- 在Map构造函数中设置范围

function init() {
  var startExtent = new Extent(-95.271, 38.933, -95.228, 38.976,
          new SpatialReference({ wkid:4326 }) );
  var myMap = new Map("mapDiv", { extent: startExtent });
  var mapServiceURL = "https://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer";
  myMap.addLayer(new ArcGISTiledMapServiceLayer(mapServiceURL));
}

通过Map.setExtent设置地图范围

function init() {
  myMap = new Map("mapDiv");
  var startExtent = new Extent(-95.271, 38.933, -95.228, 38.976,
          new SpatialReference({ wkid:4326 }) );

  myMap.setExtent(startExtent);
  var mapServiceURL = "https://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer";
  myMap.addLayer(new ArcGISTiledMapServiceLayer(mapServiceURL));
}

改变下第二个方法也行

function init() {
  myMap = new Map("mapDiv");
  var spatialRef = new SpatialReference({ wkid:4326 });
  var startExtent = new Extent();
  startExtent.xmin = -124.71;
  startExtent.ymin = 31.89;
  startExtent.xmax = -113.97;
  startExtent.ymax = 42.63;
  startExtent.spatialReference = spatialRef;

  myMap.setExtent(startExtent);
  var mapServiceURL = "https://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer";
  myMap.addLayer(new ArcGISTiledMapServiceLayer(mapServiceURL));
}

设置使用多个服务的起始范围
当在同一应用程序中包含多个服务时，默认范围是基础图层的初始范围。如果你希望自定义初始范围，你可以在Map构造函数中设置该范围。
在某些情况下，你可能自己都不知道要设多大范围。在其他情况下，你知道要使用辅助图层的范围。例如，ArcGIS Online服务都具有世界范围。你可能希望将地图范围视为本地数据的范围而不是世界范围。
在以下示例中，使用了两个服务。基础图层是具有世界范围的ArcGIS Online图层，第二个图层有一定的范围。initLayers()函数创建两个图层，您必须创建第二个函数来设置范围，因为您不能在加载类之前调用类上的属性或事件。在这种情况下，函数createMapAddLayers()被调用，对于这两个地图服务已经触发了onLoad事件。此功能创建地图，将范围设置为myService2，然后将两个地图服务添加到地图。初始地图范围

function initLayers() {
  var primaryMapServiceURL = "https://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer";
  var myService1 = new ArcGISTiledMapServiceLayer(primaryMapServiceURL);

  var secondaryMapServiceURL = "https://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Petroleum/KGS_OilGasFields_Kansas/MapServer";
  var myService2 = new ArcGISDynamicMapServiceLayer(secondaryMapServiceURL, {opacity:0.75});

  var layerLoadCount = 0;
  //When both layers have loaded, run addLayersSetExtent
  myService1.on("load", function(service) {
    layerLoadCount += 1;
    if (layerLoadCount === 2) {
      createMapAddLayers(myService1,myService2);
    }
  });

  myService2.on("load", function(service) {
    layerLoadCount += 1;
    if (layerLoadCount === 2) {
      createMapAddLayers(myService1,myService2);
    }
  });
}

//Create a map, set the extent, and add the services to the map.
function createMapAddLayers(myService1,myService2) {
  //create map
  myMap = new Map("mapDiv", { extent:myService2.fullExtent });
  myMap.addLayer(myService1);
  myMap.addLayer(myService2);
}

获得地图当前范围
您可以使用Map.onExtentChange事件获取地图的当前范围。
在以下示例中，Map.onExtentChange在init()函数中引用。当用户平移或缩放地图时，将对该showExtent()功能进行回调，返回extent对象。在该示例中，对象被命名为ext，对象属性包括xmin，ymin，xmax，和ymax。在该showExtent()功能中，四个范围值在一个字符串中连接在一起，以便在HTML页面上显示。

function init(){
 var myMap = new Map("mapDiv");

 var mapServiceURL = "https://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer";
 myMap.addLayer(new ArcGISTiledMapServiceLayer(mapServiceURL));
 myMap.addLayer(mapServiceURL);

 myMap.on("extent-change", showExtent);
}

function showExtent(ext){
 var extentString = "";
 extentString = "XMin: " + ext.xmin +
   " YMin: " + ext.ymin +
   " XMax: " + ext.xmax +
   " YMax: " + ext.ymax;
 document.getElementById("onExtentChangeInfo").innerHTML = extentString;
}

你也可以使用Map.extent获取当前的范围
您可以使用Map.extent属性获取地图的当前范围。此属性是只读属性。如果要设置范围，则需要使用Map.setExtent方法。

本文首发于微信公众号：GISXXCOM
这里写图片描述

设置和使用地图的范围—ArcGIS API for JavaScript

猜你喜欢