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



  1. function init() {


  2. var startExtent = new Extent(-95.271, 38.933, -95.228, 38.976,


  3. new SpatialReference({ wkid:4326 }) );


  4. var myMap = new Map("mapDiv", { extent: startExtent });


  5. var mapServiceURL = "https://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer";


  6. myMap.addLayer(new ArcGISTiledMapServiceLayer(mapServiceURL));


  7. }

    ②使用Map.setExtent()方法设置extent



  1. function init() {


  2. myMap = new Map("mapDiv");


  3. var startExtent = new Extent(-95.271, 38.933, -95.228, 38.976,


  4. new SpatialReference({ wkid:4326 }) );




  5. myMap.setExtent(startExtent);


  6. var mapServiceURL = "https://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer";


  7. myMap.addLayer(new ArcGISTiledMapServiceLayer(mapServiceURL));


  8. }

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。



  1. function initLayers() {


  2. var primaryMapServiceURL = "https://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer";


  3. var myService1 = new ArcGISTiledMapServiceLayer(primaryMapServiceURL);




  4. var secondaryMapServiceURL = "https://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Petroleum/KGS_OilGasFields_Kansas/MapServer";


  5. var myService2 = new ArcGISDynamicMapServiceLayer(secondaryMapServiceURL, {opacity:0.75});




  6. var layerLoadCount = 0;


  7. //When both layers have loaded, run addLayersSetExtent


  8. myService1.on("load", function(service) {


  9. layerLoadCount += 1;


  10. if (layerLoadCount === 2) {


  11. createMapAddLayers(myService1,myService2);


  12. }


  13. });




  14. myService2.on("load", function(service) {


  15. layerLoadCount += 1;


  16. if (layerLoadCount === 2) {


  17. createMapAddLayers(myService1,myService2);


  18. }


  19. });


  20. }




  21. //Create a map, set the extent, and add the services to the map.


  22. function createMapAddLayers(myService1,myService2) {


  23. //create map


  24. myMap = new Map("mapDiv", { extent:myService2.fullExtent });


  25. myMap.addLayer(myService1);


  26. myMap.addLayer(myService2);


  27. }

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

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

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



  1. function init(){


  2. var myMap = new Map("mapDiv");




  3. var mapServiceURL = "https://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer";


  4. myMap.addLayer(new ArcGISTiledMapServiceLayer(mapServiceURL));


  5. myMap.addLayer(mapServiceURL);




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


  7. }




  8. function showExtent(ext){


  9. var extentString = "";


  10. extentString = "XMin: " + ext.xmin +


  11. " YMin: " + ext.ymin +


  12. " XMax: " + ext.xmax +


  13. " YMax: " + ext.ymax;


  14. document.getElementById("onExtentChangeInfo").innerHTML = extentString;


  15. }

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

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

bd95ccb357c53a67a2670674ca0e2f8b.jpeg

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值