arcgis api for flex开发Query查询定位与中心定位查询功能 弹出

??? 一直以来都是准备基础数据，发布各种地图服务（诸如各种mapserver基础地图服务、查询服务，NA服务-路径分析服务，Geocode server，专题地图服务等等），最近终于闲下来，可以做点自己一直想做的事情了。自己发布服务，自己coding调用。主要功能是利用arcgis api for flex开发，实现Query查询定位，与中心定位查询功能，并 弹出定制提示框（气泡显示详细信息）。

???? 先从最基本的开始，参考参考官网上面的sample，开始着手做一个查询与定位的Demo，先看效果，然后再详细简单说明一下步骤。如下图所示：

（1）地名搜索

（2）地名搜索结果中心定位

（3）图层查询

图层4为草莓采摘点图层，所示区域为曹庵镇草莓采摘点分布。

（4）详细信息查询

点击查看任意一个曹庵草莓采摘点查看详细信息。

??????? 如上各图所示，基本上分为如下几个部分：

1、加载与显示基础地图（发布的基础底图地图），利用ArcGISTiledServiceLayer加载切片地图。

<esri:Map id="myMap">			
	<esri:ArcGISTiledMapServiceLayer id="map"
	url="http://192.168.0.1:8399/arcgis/rest/services/testmap/MapServer"/>
</esri:Map>

2、地名搜索与搜索结果中心定位（图1和图2）

在申明描述中（? <fx:Declarations>......</fx:Declarations>??? ）定义搜索相关内容。

	<!-- Find Task -->
	<esri:FindTask id="findTask"
			executeComplete="FindTask(event)"
			url="http://192.168.0.1:8399/arcgis/rest/services/LayerData/MapServer"/>
?? ???? 
?? ??? ?<esri:FindParameters id="myFindParams"
?? ??? ??? ??? ??? ??? ??? ? contains="true"
?? ??? ??? ??? ??? ??? ??? ? layerIds="[0]"
?? ??? ??? ??? ??? ??? ??? ? outSpatialReference="{map.spatialReference}"
?? ??? ??? ??? ??? ??? ??? ? returnGeometry="true"
?? ??? ??? ??? ??? ??? ??? ? searchFields="[NAME]"
?? ??? ??? ??? ??? ??? ??? ? searchText="{fText.text}"/>

为了完成输入字符串的搜索结果显示和动作相应，还需要写执行函数。（放置在<fx:Script>中）

关于搜索结果的定位，首先要在搜索函数（FIndTask）中讲搜索结果进行存储，定义一个FeatureSet变量，FeatureSet的存储和使用方法如下说明。

public?? ?var returnFeatureSet:FeatureSet=new FeatureSet(); //定义

returnFeatureSet.features = event.findResults; //存储查询结果

var graphic:Graphic=returnFeatureSet.features[selectdex].feature;//按照DataGrid点击索引号，对存储结果进行读取 。

以下是几个函数实现主体:

private function FindTask(event:FindEvent):void
			{
				myGraphicsLayer.clear();
				var graphic:Graphic;
				
				resultSummary.text = "Found " + event.findResults.length + " results.";
				
				var resultCount:int = event.findResults.length;
				
				for (var i:Number = 0; i < resultCount; i++)
				{
					graphic = event.findResults[i].feature;
					graphic.toolTip = event.findResults[i].value;

					graphic.symbol = picsymbol0;
					myGraphicsLayer.add(graphic);
				 }
				//saved in FeatureSet
				returnFeatureSet.features =  event.findResults;			
			}
		
			protected function DataGrid_itemClickEvent(event:MouseEvent):void
			{			
				var selectdex:Number= dgrid.selectedIndex;
				var graphic:Graphic=returnFeatureSet.features[selectdex].feature;
				
				var geomrtry:Geometry=graphic.geometry;
				
				var newppoint:MapPoint=geomrtry as  MapPoint;
				graphic.symbol=picsymbol0;

				myMap.level=7;
				myMap.centerAt(newppoint);				
				
				var point:MapPoint=geomrtry.extent.center;
				var extent:Extent=new Extent();
				myGraphicsLayer.add(graphic);
				
				var graphicsExtent:Extent = GraphicUtil.getGraphicsExtent(returnFeatureSet.features[selectdex]);
				if (graphicsExtent)
				{
					myMap.extent = graphicsExtent;
				}
			}

3 图层查询（图3）

加载图层查询服务

<esri:FeatureLayer id="features"
		outFields="[*]"
		url="http://192.168.0.96:8399/arcgis/rest/services/QueryData/MapServer/{FeaturePicker.selectedIndex+1}">

图层选择采用DropList下拉菜单（主意设定featurepicker.selectedIndex初始值为-1）

<s:DropDownList id="featurePicker" width="178">
				<s:ArrayList>
					<fx:String>草莓采摘点</fx:String>
					<fx:String>葡萄采摘点</fx:String>
					<fx:String>西瓜采摘点</fx:String>
					<fx:String>桃子采摘点</fx:String>
				</s:ArrayList>
			</s:DropDownList>							

图层图标渲染：

<esri:renderer>
					<esri:ClassBreaksRenderer attribute="layerID">
						<esri:ClassBreakInfo maxValue="2" minValue="1" symbol="{picsymbol1}"/>
						<esri:ClassBreakInfo maxValue="3" minValue="2" symbol="{picsymbol2}"/>
						<esri:ClassBreakInfo maxValue="4" minValue="3" symbol="{picsymbol3}"/>
					</esri:ClassBreaksRenderer>
				</esri:renderer>

4 对象详细信息查询

使用infoWindowRenderer渲染弹出定制提示框（这个请查看官网例子http://help.arcgis.com/en/webapi/flex/samples/index.html#/InfoWindows_for_FeatureLayer/01nq00000057000000/）

<esri:infoWindowRenderer>
					<fx:Component>
						<esri:LabelDataRenderer>
							<esri:label>{data.NAMEC}</esri:label>
							<s:BorderContainer  id="infowindow" backgroundColor="white"
												borderColor="black"
												color="green"
												cornerRadius="5"
												minHeight="0"
												minWidth="0">
								<s:layout>
									<s:VerticalLayout paddingBottom="5"
													  paddingLeft="5"
													  paddingRight="5"
													  paddingTop="5"/>
								</s:layout>
								
								<s:Label>联系人:{data.RDNAME} </s:Label>
								<s:Label>电话:{data.STAKE} </s:Label>
								<s:Label>地址:{data.RDNUMBER} </s:Label>
								<s:Label>网址:{data.REMARK} </s:Label>
							</s:BorderContainer>						
						</esri:LabelDataRenderer>
					</fx:Component>
				</esri:infoWindowRenderer>

若有需要mxml源码文件，请留邮箱或者直接QQ联系我（2603508359）。