ArcGIS Server Flex实现GraphicsLayer上画点、线、面

发布时间：2020-12-15 04:25:29 所属栏目：百科来源：网络整理

导读：ArcGIS Server Flex实现GraphicsLayer上画点、线、面 ?? ? 目的： 1.ArcGIS API for Flex 实现GraphicsLayer上画点、线、面。准备工作： 1.这次地图数据就用Esri提供的 http://server.arcgisonline.com/ArcGIS/rest/services/NPS_Physical_World_2D/MapSer

ArcGIS Server Flex实现GraphicsLayer上画点、线、面??

目的：
1.ArcGIS API for Flex实现GraphicsLayer上画点、线、面。
准备工作：
1.这次地图数据就用Esri提供的http://server.arcgisonline.com/ArcGIS/rest/services/NPS_Physical_World_2D/MapServer。
完成后的效果图：

开始：
1.启动Flex Builder3新建工程以及引入ArcGIS API for Flex library的开发包。
2.新建DrawTool.mxml页面，然后在页面上添加esri:Map控件设置esri:ArcGISTiledMapServiceLayer等。
3.和上一篇一样仍旧用mx:ToggleButtonBar来实现功能按钮，mx:ToggleButtonBar需要包含6个按钮分别实现6种不一样的操作，具体代码如下：
?1

<mx:ToggleButtonBar?iconField="icon"??horizontalCenter="-47"?verticalCenter="-151"?itemClick="itemClickHandler(event)"?toggleOnClick="true">
?2

????????<mx:dataProvider>
?3

????????<mx:Array>
?4

????????<mx:Object?icon="{point}"?/>
?5

????????<mx:Object?icon="{point2}"?/>
?6

????????<mx:Object?icon="{polyline3}"?/>
?7

????????<mx:Object?icon="{polyline}"?/>
?8

????????<mx:Object?icon="{polyline2}"?/>
?9

????????<mx:Object?icon="{polygon}"?/>
10

????????<mx:Object?icon="{polygon2}"?/>
11

????????<mx:Object?icon="{polygon3}"?/>
12

????????</mx:Array>
13

????????</mx:dataProvider>
14

????????</mx:ToggleButtonBar>
4.上面的代码中icon对应的图标定义在mx:Script中如下：
?1

//图标图片
?2

????????????[Bindable]?
?3

????????????[Embed(source="assets/point.gif")]
?4

????????????public?var?point:Class;?
?5

????????????
?6

????????????[Bindable]?
?7

????????????[Embed(source="assets/point2.gif")]
?8

????????????public?var?point2:Class;?
?9

????????????
10

????????????[Bindable]?
11

????????????[Embed(source="assets/polyline.gif")]
12

????????????public?var?polyline:Class;?
13

????????????
14

????????????[Bindable]?
15

????????????[Embed(source="assets/polyline3.gif")]
16

????????????public?var?polyline3:Class;?
17

????????????
18

????????????[Bindable]?
19

????????????[Embed(source="assets/polyline2.gif")]
20

????????????public?var?polyline2:Class;?
21

????????????
22

????????????[Bindable]?
23

????????????[Embed(source="assets/polygon.gif")]
24

????????????public?var?polygon:Class;?
25

????????????
26

????????????[Bindable]?
27

????????????[Embed(source="assets/polygon2.gif")]
28

????????????public?var?polygon2:Class;?
29

????????????
30

????????????[Bindable]?
31

????????????[Embed(source="assets/polygon3.gif")]
32

????????????public?var?polygon3:Class;?
5.现在要实现在地图上画点、线等就需要esri:GraphicsLayer 的功能，实际上点、线、面都是画在GraphicsLayer的所以需要在Map控件中添加：
1

<esri:Map?id="myMap"?extent="{allMap}"?logoVisible="false">
2

????????<esri:ArcGISTiledMapServiceLayer?url="http://server.arcgisonline.com/ArcGIS/rest/services/NPS_Physical_World_2D/MapServer"?/>
3

????????<esri:GraphicsLayer?id="myGraphicsLayer"/>?
4

????</esri:Map>
6.要进行绘制功能esri已经提供了esri:Draw这个控件能很方便的实现基本图形的绘制，使用代码如下：
1

<esri:Draw?id="drawToolbar"?map="{myMap}"?graphicsLayer="{myGraphicsLayer}"?/>
7.esri:Draw有2个属性一个是要进行画图操作的地图控件，一个是画图的容器GraphicsLayer 。
8.接下来定义一下画出来的点、线、面的显示样式，代码如下：
1

<esri:SimpleLineSymbol?id="sls"?style="solid"?color="0xFF0000"?width="2"?alpha="1"/>
2

<esri:SimpleMarkerSymbol?id="sms"?style="square"?color="0xFF0000"?size="10"?/>
3

<esri:SimpleFillSymbol?id="sfs"?style="solid"?color="0xFF0000"?alpha="0.5"/>
9.上面的sls为线的显示样式；sms为点的显示样式；sfs为面的显示样式，关于样式的定义可以查询一下帮助了有很多的样式等可以实现。
10.最后就是编写功能代码在上面的ToggleButtonBar控件中已经给它添加了一个itemClick="itemClickHandler(event)"，这里就是编写itemClickHandler(event)这个方法的代码：
?1

import?mx.events.ItemClickEvent;
?2

private?function?itemClickHandler(event:ItemClickEvent):void
?3