地图查询定位功能(Flex API)
ArcGIS Server 10.0+Flex API 2.5. 实现查询定位,目标区域边界高亮。
1.使用QueryTask获得查询信息。
2.将查询结果以Graphic形式放在GraphicsLayer上。
3.对相应graphic设置Symbol,高亮显示,使用SimpleFillSymbol、SimpleLineSymbol,其中SimpleFillSymbol设置为空,设置outline,即实现边界高亮效果。
效果图:
具体:
1.使用QueryTask获得查询信息:
where语句中格式需注意,字符的值使用单引号,数字不需单引号。
//省区域查询 protected function button1_clickHandler():void { var queryTask:QueryTask=new QueryTask; var query:Query=new Query(); queryTask.url="http://192.168.100.226:8399/arcgis/rest/services/abs_cni/ChinaRegion/MapServer/2"; query.returnGeometry=true; query.outFields = ["name"]; query.outSpatialReference = map.spatialReference; query.where="name like '%"+sheng.text+"%'"; queryTask.execute(query,new AsyncResponder(onResult,onFault)); }
2.将查询结果以Graphic形式放在GraphicsLayer上,并定位(居中显示),即获得查询结果graphic的extent。
可能在浏览器上居中显示时,区域边界部分显示不完全,可以将区域放大,即“map.extent = graphic.geometry.extent.expand(1.5);”,代表将范围在原有基础上扩大50%。
此处犯过两个错误:
(1).使用以下方法,实质获得graphic之和的extent。
var graphicProvider:ArrayCollection = myGraphicsLayer.graphicProvider as ArrayCollection;
var graphicsExtent:Extent = GraphicUtil.getGraphicsExtent(graphicProvider.toArray());
(2).结果函数里忘记清除之前graphic,即“myGraphicsLayer.clear();”,这样一来,由于之前查询结果的graphic的影响,多次查询后extent也是错误的。
改正后正确方法如下:
private function onResult(featureSet:FeatureSet,token:Object = null):void { for each(var graphic:Graphic in featureSet.features) { myGraphicsLayer.clear(); graphic.symbol=QuerySymbol; myGraphicsLayer.add(graphic); map.extent = graphic.geometry.extent.expand(1.5); } } private function onFault(info:Object, token:Object = null ):void { Alert.show("Error!"); }
3.设置高亮显示的symbol,面符号中可设置为空,加上outline,这样即可边界高亮显示。
<esri:SimpleFillSymbol id="QuerySymbol" color="0xFF0000" alpha="0.6" outline="{sls}" style="null"> </esri:SimpleFillSymbol> <esri:SimpleLineSymbol id="sls" color="0xFF0000" alpha="1" style="solid"> </esri:SimpleLineSymbol>
另:如果使用FlexViewer,单独做成widget的话,别忘了设置widget初始化函数加载graphicslayer,以及关闭wigdet时的清除graphic(“myGraphicsLayer.clear();”)