ArcGIS API For JavaScript官方文档(六)之设置范围

简介: ArcGIS API For JavaScript官方文档(六)之设置范围

使用地图的一个常见操作是设置地图的extent(范围)或获取在其他操作中使用的extent。在map上设置新extent的简单替代方案是调用map的centerAndZoom()方法,该方法基于给定中心点和细节级别(level of detail-LOD)设置新的extent。


1、默认的extent

如果在初始化map时不包含extent信息,默认extent作为初始化extent信息,即上次在地图文档中保存时地图的extent。


如果您使用的服务不止一个,默认的extent是base map(底图)或者添加的第一层layer的初始extent。


2、设置一个新的起始extent

如果您希望起始extent不是默认的extent,您有几个方式可用于设置此新的extent

①在Map 构造器中设置extent

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()方法设置extent

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));
}


3、使用多个服务时设置起始extent

当您在同一应用程序中包含多个服务时,默认的extent是base layer的初始extent。如果您希望初始extent是新的,并且提前知道extent,则可以将该extent包含在map的构造函数中。


在某些情况下,您可能无法提前知道extent。在其他情况下,您希望使用第二层的layer。例如,ArcGIS Online services(ArcGIS在线服务)都有一个world extent,您可能希望您的地图extent是本地数据的extent,而不是world extent。


在下面的示例中,使用了两个服务或layers。base layer是具有world extent的ArcGIS Online layer,第二个layer具有堪萨斯州的extent,这是所需的extent。initLayers()函数用于创建两个layers。您必须创建第二个函数来设置extent,因为不能在类被加载之前调用属性或事件。在本例中,触发了对两个地图服务的onLoad事件之后调用函数createMapAddLayers()。该函数创建map,设置myService2的extent,然后将两个map服务添加到map中。初始map的extent使用map服务定义的Layer.fullExtent属性,如果要使用初始extent,可以使用Layer.initialExtent。

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);
}


4、使用地图事件获取当前extent

您可以使用Map.onExtentChange事件获取map当前extent。


在下面的例子中,map.onExtentChange在inti()函数中被引用。当用户对地图进行平移或缩放时,会对showExtent()函数进行回调。onExtentChange事件构建了对象,第一个对象是extent。在本例中,该对象被命名为ext,对象属性包括xmin、ymin、xmax和ymax。在ShowExtent()函数中,四个extent值被连接成一个字符串并在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;
}


5、使用Map.extent属性获取当前extent

您可以通过Map.extent属性获取当前extent,这个属性是只读的。如果您向设置当前extent,您需要使用Map.setExtent()方法


相关文章
|
2月前
|
API
阿里云短信服务文档与实际API不符
阿里云短信服务文档与实际API不符
|
1月前
|
JSON 前端开发 API
后端开发中的API设计与文档编写指南####
本文探讨了后端开发中API设计的重要性,并详细阐述了如何编写高效、可维护的API接口。通过实际案例分析,文章强调了清晰的API设计对于前后端分离项目的关键作用,以及良好的文档习惯如何促进团队协作和提升开发效率。 ####
|
3月前
|
JavaScript 前端开发 API
JavaScript 验证 API
JavaScript 验证 API
38 2
|
4月前
|
Java API 数据中心
百炼平台Java 集成API上传文档到数据中心并添加索引
本文主要演示阿里云百炼产品,如何通过API实现数据中心文档的上传和索引的添加。
151 3
|
4月前
|
JSON API 网络架构
SharePoint REST API 设置SummaryLength属性
【8月更文挑战第10天】在SharePoint中,可通过REST API设定`SummaryLength`属性来控制列表或库内项目摘要的显示长度。首先确定目标URL,接着构建POST请求并指定JSON格式的新摘要长度值,例如设置为100字符。利用Postman等工具发送请求,并确保提供认证信息。成功后,摘要长度将按设定更新,注意操作权限及对用户体验的影响。
|
4月前
|
API 网络架构 开发者
【Azure 环境】调用Azure RunCommand 的REST API 设置虚拟机的环境变量(SetEnvironmentVariable)
【Azure 环境】调用Azure RunCommand 的REST API 设置虚拟机的环境变量(SetEnvironmentVariable)
|
4月前
|
JSON Java API
【Azure API 管理】通过Java APIM SDK创建一个新的API,如何为Reqeust的Representation设置一个内容示例(Sample)?
【Azure API 管理】通过Java APIM SDK创建一个新的API,如何为Reqeust的Representation设置一个内容示例(Sample)?
|
4月前
|
存储 API 开发工具
【Azure API 管理】API Management如何有效且快速更新呢?如对APIs/Policy等设置内容
【Azure API 管理】API Management如何有效且快速更新呢?如对APIs/Policy等设置内容
|
4月前
|
API
【Azure API 管理】Azure API Management在设置 Policy时,如何对URL进行解码呢? 使用 HttpUtility.UrlDecode 出错
【Azure API 管理】Azure API Management在设置 Policy时,如何对URL进行解码呢? 使用 HttpUtility.UrlDecode 出错
|
4月前
|
JSON 小程序 API
【Azure API 管理】APIM CORS策略设置后,跨域请求成功和失败的Header对比实验
【Azure API 管理】APIM CORS策略设置后,跨域请求成功和失败的Header对比实验