引用地址:https://developers.arcgis.com/flex/guide/using-extent.htm
本教程描述几种方式设置地图的范围以及如何取得用于其他操作程度。
Setting an extent
使用 extent 属性
<esri:Extent>
标记,指定ID 和 coordinates坐标.第二步:添加
<esri:ArcGISDynamicMapServiceLayer>标记
.
- <?xml version="1.0" encoding="utf-8"?>
- <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark"
- xmlns:mx="library://ns.adobe.com/flex/mx" xmlns:esri="http://www.esri.com/2008/ags">
- <fx:Declarations>
- <esri:SpatialReference id="wgs" wkid="4326"/>
- <esri:Extent id="extentOfKansas" spatialReference="{wgs}" xmax="-94" xmin="-103" ymax="41" ymin="36"/>
- </fx:Declarations>
- <esri:Map id="myMap" extent="{extentOfKansas}">
- <esri:ArcGISTiledMapServiceLayer url="http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer"/>
- <esri:ArcGISDynamicMapServiceLayer id="myLayer"
- url="http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Petroleum/KGS_OilGasFields_Kansas/MapServer"/>
- </esri:Map>
- </s:Application>
添加 <esri:SpatialReference>
标记,指定坐标点wkid 设置 ID.
插入 <esri:extent>
标记,指定ID 和 coordinates坐标.
添加 <ArcGISTiledMapServiceLayer>
标记.
- <?xml version="1.0" encoding="utf-8"?>
- <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
- xmlns:s="library://ns.adobe.com/flex/spark"
- xmlns:mx="library://ns.adobe.com/flex/mx"
- xmlns:esri="http://www.esri.com/2008/ags">
- <fx:Declarations>
- <esri:SpatialReference id="wgs" wkid="4326"/>
- </fx:Declarations>
- <esri:Map id="myMap">
- <esri:extent>
- <esri:Extent spatialReference="{wgs}" xmax="-94" xmin="-103" ymax="41" ymin="36"/>
- </esri:extent>
- <esri:ArcGISTiledMapServiceLayer url="http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer"/>
- <esri:ArcGISDynamicMapServiceLayer id="myLayer"
- url="http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Petroleum/KGS_OilGasFields_Kansas/MapServer"/>
- </esri:Map>
- </s:Application>
- <?xml version="1.0" encoding="utf-8"?>
- <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark"
- xmlns:mx="library://ns.adobe.com/flex/mx" xmlns:esri="http://www.esri.com/2008/ags">
- <esri:Map id="myMap">
- <esri:extent>
- <!-- 地图的当前视图对应的地理坐标范围 -->
- <esri:Extent xmax="-6815000" xmin="-14298000" ymax="7117000" ymin="2748000">
- <esri:SpatialReference wkid="102100"/>
- </esri:Extent>
- </esri:extent>
- <esri:ArcGISTiledMapServiceLayer url="http://server.arcgisonline.com/ArcGIS/rest/services/World_Physical_Map/MapServer"/>
- </esri:Map>
- </s:Application>
Setting an extent when using multiple services
当多个服务使用同一个范围时
在某些情况下,你可能想要设置一个层的空间范围,而不是初始化层或底图,为此,在所需的层上设置地图的extent属性,在下面代码中我们使用到了2个层,第一个是底图(ArcGIS Online world extent)、第二个是凯萨斯州的层layer (the state of Kansas)
设置凯萨斯州的extent,添加一个load属性,然后再在map上设置extent(范围)
load="myMap.extent = myKansasLayer.fullExtent"
当创建地图时,这个load属性被加载, 然后在Kansas layer(凯萨斯州)层中设置 全局的extent . 下面的代码片段使用 fullExtent
来设置map extent
- <?xml version="1.0" encoding="utf-8"?>
- <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
- xmlns:s="library://ns.adobe.com/flex/spark"
- xmlns:mx="library://ns.adobe.com/flex/mx"
- xmlns:esri="http://www.esri.com/2008/ags">
- <esri:Map id="myMap">
- <esri:ArcGISTiledMapServiceLayer url="http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer"/>
- <esri:ArcGISDynamicMapServiceLayer id="myKansasLayer" load="myMap.extent = myKansasLayer.fullExtent"
- url="http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Petroleum/KGS_OilGasFields_Kansas/MapServer"/>
- </esri:Map>
- </s:Application>
设置 initial extent代替 full extent,使用 myKansasLayer.initialExtent
Getting the current extent
取得当前地图上的extent 使用 extent 属性.
Listening to extent changes
监听extent的变化,当用户在地图上每次拖动地图或缩放地图时,会触发一个 ExtentEvent 事件,你可以添加一个事件监听,使用MXML或ActionScript,用于通知每次extent的变化,参考下面的例子
-
MXML 示例:
<esri:Map id="myMap" extentChange="displayExtent()"> <esri:ArcGISTiledMapServiceLayer url="http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer" /> </esri:Map>
-
ActionScript 示例:
myMap.addEventListener(ExtentEvent.EXTENT_CHANGE, extentChangeHandler);