1.功能:
选择图层然后按照用户所画的点,线,面查询属性,并且对查到的地理元素进行高亮显示同时在右边的Grid中显示查到的数据。
2.效果图:
3.步骤
新建identifytest.mxml页面,然后在页面上添加map控件以及需要高亮显示被查询到的元素的GraphicsLayer:
<esri:ArcGISDynamicMapServiceLayer id="myMapServiceLayer" url="http://192.168.47.29:8399/arcgis/rest/services/China/MapServer" complete="mapHandler(event)">
</esri:ArcGISDynamicMapServiceLayer>
<esri:GraphicsLayer id="myGraphicsLayer" symbolFunction="{mySymbolFunction}">
</esri:GraphicsLayer>
<esri:extent>
<esri:Extent id = "esriMapExtent" xmin="73.4" ymin="13.33" xmax="135.2" ymax="63.4"/>
</esri:extent>
</esri:Map>
代码中给ArcGISDynamicMapServiceLayer添加了一个complete事件用来当地图载入完成后获取地图的图层名称显示在地图下方的ComboBox上:
<mx:ComboBox id="layerList" verticalCenter="500" x="139">
</mx:ComboBox>
private function mapHandler(event:Event):void{
//获取图层信息数组
var layerInfos:Array;
layerInfos=myMapServiceLayer.layerInfos;
var layers:Array=new Array();
//遍历图层信息数组然后把图层的名称和index值添加到新的数组中
for(var i:int = 0;i<layerInfos.length;i++){
layers.push({label:layerInfos[i].name,data:i});
}
//给Combox设定数据源
layerList.dataProvider=layers;
}
同时,在GraphicsLayer中也添加了一个symbolFunction的功能,这个功能是当有元素添加到GraphicLayer时进行元素显示样式的设置,这样分别对点、线、面进行样式设定:
<esri:SimpleMarkerSymbol id="sms" style="diamond" color="0x00ff00" size="15"/>
<esri:SimpleLineSymbol id="sls" style="solid" color="0x00ff00" width="2" alpha="1"/>
<esri:SimpleFillSymbol id="sfs"/>
private function mySymbolFunction(graphic:Graphic):Symbol{
var result:Symbol;
//根据元素的类型进行显示样式的设定
switch(graphic.geometry.type){
case Geometry.MAPPOINT:{result=sms;break;}
case Geometry.POLYLINE:{result=sls;break;}
case Geometry.POLYGON:{result=sfs;break;}
}
return result;
}
要有画图和一些常规按钮,实现放大,缩小等常规功能,以及实现能在GraphicsLayer上画点、线、面的功能,代码如下:
<esri:Draw id="drawToolbar" map="{myMap}" graphicsLayer="{myGraphicsLayer}" drawEnd="drawEndHandler(event)"/>
<mx:HBox horizontalAlign="center" width="100%">
<mx:ControlBar horizontalGap="0" paddingBottom="0" paddingTop="0">
<mx:Button label="放大" click="navToolbar.activate(Navigation.ZOOM_IN)" />
<mx:Button label="缩小" click="navToolbar.activate(Navigation.ZOOM_OUT)" />
<mx:Button label="漫游" click="navToolbar.activate(Navigation.PAN)" />
<mx:Button label="上级窗口" click="navToolbar.zoomToPrevExtent()" enabled="{!navToolbar.isFirstExtent}"/>
<mx:Button label="下级窗口" click="navToolbar.zoomToNextExtent()" enabled="{!navToolbar.isLastExtent}"/>
<mx:Button label="复位" click="navToolbar.zoomToFullExtent()"/>
<mx:Button label="点" click="drawToolbar.activate(Draw.MAPPOINT)" />
<mx:Button label="线" click="drawToolbar.activate(Draw.POLYLINE)" />
<mx:Button label="流线" click="drawToolbar.activate(Draw.FREEHAND_POLYLINE)" />
<mx:Button label="矩形" click="drawToolbar.activate(Draw.EXTENT)" />
<mx:Button label="多边形" click="drawToolbar.activate(Draw.POLYGON)" />
<mx:Button label="流多边形" click="drawToolbar.activate(Draw.FREEHAND_POLYGON) "/>
<mx:Button label="结束绘制" click="drawToolbar.deactivate() "/>
</mx:ControlBar>
</mx:HBox>
最后,就是在esri:Draw组件中添加一个drawEnd属性,它的功能是当绘图完成后执行drawEndHandler(event)方法,我们在这个方法里实现Identify的功能。代码如下:
<esri:IdentifyTask id="identifyTask" identifyComplete="identifyCompleteHandler(event)" url="http://192.168.47.29:8399/arcgis/rest/services/China/MapServer%22/>
//获取绘图结果Geometry
var geometry:Geometry=event.graphic.geometry;
var identifyParams:IdentifyParameters= new IdentifyParameters();
//查询结果需要返回Geometry
identifyParams.returnGeometry=true;
//查询冗余范围
identifyParams.tolerance=3;
identifyParams.width=myMap.width;
identifyParams.height=myMap.height;
//设置查询的geometry
identifyParams.geometry=geometry;
//从ComboBox获取选择的图层index设置要查询的图层
var layers:Array=new Array();
layers.push(layerList.value);
identifyParams.layerIds=layers;
//查询可见图层
identifyParams.layerOption=IdentifyParameters.LAYER_OPTION_VISIBLE;
identifyParams.mapExtent=myMap.extent;
//进行查询
identifyTask.execute(identifyParams);
}
//查询完成后执行的事件
private function identifyCompleteHandler(event:IdentifyEvent):void{
var datas:Array=new Array();
//myGraphicsLayer.clear();
//遍历查询结果把查询到的feature添加到GraphicLayer进行高亮显示
//同时把查询到的元素的名称添加到datas对象数组用来datagrid显示用
for each(var result:IdentifyResult in event.identifyResults){
myGraphicsLayer.add(result.feature);
//datas.push(result.feature.attributes);
datas.push({"value":result.value})
}
datalist.dataProvider=datas;
}
ok!做完以上事情后就大功告成了!
现附上全部代码如下:
<mx:Application
xmlns:mx="http://www.adobe.com/2006/mxml"
xmlns:esri="http://www.esri.com/2008/ags"
pageTitle="Query Task"
>
<mx:Script>
<![CDATA[
import com.esri.ags.Graphic;
import com.esri.ags.events.DrawEvent;
import com.esri.ags.events.IdentifyEvent;
import com.esri.ags.geometry.Geometry;
import com.esri.ags.symbol.Symbol;
import com.esri.ags.tasks.IdentifyParameters;
import com.esri.ags.tasks.IdentifyResult;
//获取地图图层名称和index到combobox上
private function mapHandler(event:Event):void{
//获取图层信息数组
var layerInfos:Array;
layerInfos=myMapServiceLayer.layerInfos;
var layers:Array=new Array();
//遍历图层信息数组然后把图层的名称和index值添加到新的数组中
for(var i:int = 0;i<layerInfos.length;i++){
layers.push({label:layerInfos[i].name,data:i});
}
//给Combox设定数据源
layerList.dataProvider=layers;
}
//symbolFunction的功能是当有元素添加到graphiclayer时进行元素显示样式的设置,这样分别对点、线、面进行设定
private function mySymbolFunction(graphic:Graphic):Symbol{
var result:Symbol;
//根据元素的类型进行显示样式的设定
switch(graphic.geometry.type){
case Geometry.MAPPOINT:{result=sms;break;}
case Geometry.POLYLINE:{result=sls;break;}
case Geometry.POLYGON:{result=sfs;break;}
}
return result;
}
private function drawEndHandler(event:DrawEvent):void{
//获取绘图结果Geometry
var geometry:Geometry=event.graphic.geometry;
var identifyParams:IdentifyParameters= new IdentifyParameters();
//查询结果需要返回Geometry
identifyParams.returnGeometry=true;
//查询冗余范围
identifyParams.tolerance=3;
identifyParams.width=myMap.width;
identifyParams.height=myMap.height;
//设置查询的geometry
identifyParams.geometry=geometry;
//从ComboBox获取选择的图层index设置要查询的图层
var layers:Array=new Array();
layers.push(layerList.value);
identifyParams.layerIds=layers;
//查询可见图层
identifyParams.layerOption=IdentifyParameters.LAYER_OPTION_VISIBLE;
identifyParams.mapExtent=myMap.extent;
//进行查询
identifyTask.execute(identifyParams);
}
//查询完成后执行的事件
private function identifyCompleteHandler(event:IdentifyEvent):void{
var datas:Array=new Array();
//myGraphicsLayer.clear();
//遍历查询结果把查询到的feature添加到GraphicLayer进行高亮显示
//同时把查询到的元素的名称添加到datas对象数组用来datagrid显示用
for each(var result:IdentifyResult in event.identifyResults){
myGraphicsLayer.add(result.feature);
//datas.push(result.feature.attributes);
datas.push({"value":result.value})
}
datalist.dataProvider=datas;
}
]]>
</mx:Script>
<esri:SimpleMarkerSymbol id="sms" style="diamond" color="0x00ff00" size="15"/>
<esri:SimpleLineSymbol id="sls" style="solid" color="0x00ff00" width="2" alpha="1"/>
<esri:SimpleFillSymbol id="sfs"/>
<esri:Navigation id="navToolbar" map="{myMap}"/>
<esri:Draw id="drawToolbar" map="{myMap}" graphicsLayer="{myGraphicsLayer}" drawEnd="drawEndHandler(event)"/>
<esri:IdentifyTask id="identifyTask" identifyComplete="identifyCompleteHandler(event)" url="http://192.168.47.29:8399/arcgis/rest/services/China/MapServer"/>
<!--mx:Canvas width="490" height="311" borderStyle="solid" borderThickness="3" borderColor="#425DE2" verticalCenter="-20" x="11"-->
<esri:Map id="myMap">
<esri:ArcGISDynamicMapServiceLayer id="myMapServiceLayer" url="http://192.168.47.29:8399/arcgis/rest/services/China/MapServer" complete="mapHandler(event)">
</esri:ArcGISDynamicMapServiceLayer>
<esri:GraphicsLayer id="myGraphicsLayer" symbolFunction="{mySymbolFunction}">
</esri:GraphicsLayer>
<esri:extent>
<esri:Extent id = "esriMapExtent" xmin="73.4" ymin="13.33" xmax="135.2" ymax="63.4"/>
</esri:extent>
</esri:Map>
<mx:HBox horizontalAlign="center" width="100%">
<mx:ControlBar horizontalGap="0" paddingBottom="0" paddingTop="0">
<mx:Button label="放大" click="navToolbar.activate(Navigation.ZOOM_IN)" />
<mx:Button label="缩小" click="navToolbar.activate(Navigation.ZOOM_OUT)" />
<mx:Button label="漫游" click="navToolbar.activate(Navigation.PAN)" />
<mx:Button label="上级窗口" click="navToolbar.zoomToPrevExtent()" enabled="{!navToolbar.isFirstExtent}"/>
<mx:Button label="下级窗口" click="navToolbar.zoomToNextExtent()" enabled="{!navToolbar.isLastExtent}"/>
<mx:Button label="复位" click="navToolbar.zoomToFullExtent()"/>
<mx:Button label="点" click="drawToolbar.activate(Draw.MAPPOINT)" />
<mx:Button label="线" click="drawToolbar.activate(Draw.POLYLINE)" />
<mx:Button label="流线" click="drawToolbar.activate(Draw.FREEHAND_POLYLINE)" />
<mx:Button label="矩形" click="drawToolbar.activate(Draw.EXTENT)" />
<mx:Button label="多边形" click="drawToolbar.activate(Draw.POLYGON)" />
<mx:Button label="流多边形" click="drawToolbar.activate(Draw.FREEHAND_POLYGON) "/>
<mx:Button label="结束绘制" click="drawToolbar.deactivate() "/>
</mx:ControlBar>
</mx:HBox>
<!--/mx:Canvas-->
<mx:ComboBox id="layerList" verticalCenter="500" x="139">
</mx:ComboBox>
<mx:DataGrid id="datalist" height="100" borderColor="#1b67d9" borderStyle="solid" borderThickness="3" verticalCenter="-20" left="509"/>
</mx:Application>