设置和使用地图的范围—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/s
4000
ervices/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