6 <esri:ArcGISDynamicMapServiceLayer url="http://jh-53a435fbc0e8/ArcGIS/rest/services/USA/MapServer" />
7 <esri:GraphicsLayer id="myGraphicsLayer" symbolFunction="mySymbolFunction"/>
8 </esri:Map>
9 </mx:Canvas>
10 <mx:Label verticalCenter="-176" left="98" id="minfo" fontSize="12"/>3.这样当然还需要Draw、ToggleButtonBar等,相应代码:
2 <esri:SimpleMarkerSymbol id="sms" style="diamond" color="0x00FF00" size="15" alpha="0.7"/>
3 <esri:SimpleFillSymbol id="sfs" color="0x00FF00" alpha="0.7">
4 <esri:SimpleLineSymbol color="0x000000"/>
5 </esri:SimpleFillSymbol>
6 <esri:Draw id="drawToolbar" map="{myMap}" graphicsLayer="{myGraphicsLayer}" drawEnd="drawEndHandler(event)" />
7 <mx:ToggleButtonBar verticalCenter="-174" itemClick="itemClickHandler(event)" toggleOnClick="true" left="10">
8 <mx:dataProvider>
9 <mx:Array>
10 <mx:Object icon="{polyline}" />
11 <mx:Object icon="{polygon}" />
12 </mx:Array>
13 </mx:dataProvider>
14 </mx:ToggleButtonBar>
4.最后还需要添加GeometryService,代码如下:
2 </esri:GeometryService>
5.这样界面以及控件都已经设置完毕了,开始编写代码首先是GraphicsLayer控件的symbolFunction,就设置GraphicsLayer控件中绘图的显示样式,这个前面几个例子已经用到过多次了就不做详细说明了,代码如下:
2 {
3 var result:Symbol;
4 //根据元素的类型进行显示样式的设定
5 switch(graphic.geometry.type)
6 {
7 case Geometry.MAPPOINT:
8 {
9 result=sms;
10 break;
11 }
12 case Geometry.POLYLINE:
13 {
14 result=sls;
15 break;
16 }
17 case Geometry.POLYGON:
18 {
19 result=sfs;
20 break;
21 }
22 }
23 return result;
24 }
6.接下来按照事件的执行顺序来说明代码,首先是执行ToggleButtonBar控件的itemClick的事件方法itemClickHandler(event):
2 private function itemClickHandler(event:ItemClickEvent):void
3 {
4 switch(event.index)
5 {
6 case 0://画线
7 {
8 drawToolbar.activate(Draw.POLYLINE);
9 break;
10 }
11 case 1://画面
12 {
13 drawToolbar.activate(Draw.POLYGON);
14 break;
15 }
16 }
17 }
7.接着是Draw控件的drawEnd事件方法drawEndHandler(event):
2 private function drawEndHandler(event:DrawEvent):void
3 {
4 //为GeometryService添加PROJECT_COMPLETE完成后监听事件
5 geometryService.addEventListener(GeometryServiceEvent.PROJECT_COMPLETE,projectCompleteHandler);
6 //进行project操作
7 geometryService.project([event.graphic], new SpatialReference(32618));
8
9 }
8.上面的代码中是进行GeometryService的project操作,为GeometryService控件添加了PROJECT_COMPLETE的完成后监听事件,所接着是projectCompleteHandler方法:
2 {
3 //去除GeometryService的PROJECT_COMPLETE完成后监听事件
4 geometryService.removeEventListener(GeometryServiceEvent.PROJECT_COMPLETE,projectCompleteHandler);
5 if(event.graphics[0].geometry.type=="esriGeometryPolygon")
6 {
7 //如果是面就为GeometryService添加SIMPLIFY_COMPLETE完成后监听事件
8 geometryService.addEventListener(GeometryServiceEvent.SIMPLIFY_COMPLETE,simplifyCompleteHandler);
9 //进行simplify操作
10 geometryService.simplify(event.graphics);
11 }
12 else if(event.graphics[0].geometry.type=="esriGeometryPolyline")
13 {
14 //如果是线就为GeometryService添加LENGTHS_COMPLETE完成后监听事件
15 geometryService.addEventListener(GeometryServiceEvent.LENGTHS_COMPLETE,lengthsCompleteHandler);
16 //进行lengths操作
17 geometryService.lengths(event.graphics);
18 }
19 }
9.在上面的代码中判定是线还是面然后在分别执行不同的方法和添加监听事件,这里首先说面的情况下是进行simplify操作并且添加了SIMPLIFY_COMPLETE完成监听事件方法simplifyCompleteHandler:
2 private function simplifyCompleteHandler(event : GeometryServiceEvent):void
3 {
4 geometryService.removeEventListener(GeometryServiceEvent.SIMPLIFY_COMPLETE,simplifyCompleteHandler);
5 geometryService.addEventListener(GeometryServiceEvent.AREA_LENGTHS_COMPLETE,areaslengthsCompleteHandler);
6 var geometry:Geometry=event.graphics[0].geometry;
7 var newGraphic:Graphic=new Graphic(geometry);
8 geometryService.areasAndLengths([new Graphic(geometry)]);
9 }
10.上面的代码中是进行面的simplify操作并且完成后执行areasAndLengths并且添加完成后的监听事件areaslengthsCompleteHandler:
2 private function areaslengthsCompleteHandler(event : GeometryServiceEvent ) : void
3 {
4 geometryService.removeEventListener(GeometryServiceEvent.AREA_LENGTHS_COMPLETE,areaslengthsCompleteHandler);
5 minfo.text="面积:"+event.arealengths.areas/1000000+"km2";
6 }
11.回到第9步,当为线的情况就不做simplify操作直接进行lengths操作并且添加完成后的监听方法lengthsCompleteHandler:
2 private function lengthsCompleteHandler(event : GeometryServiceEvent):void
3 {
4 geometryService.removeEventListener(GeometryServiceEvent.LENGTHS_COMPLETE,lengthsCompleteHandler);
5 minfo.text="距离:"+event.lengths[0]/1000+"km";
6 }
12.这样就完成了距离和面积的量算功能,这样要特别地图数据等情况进行project、simplify操作否则会得到不正确的结果。