空间管理您的位置: 3sNews.Net——3S社区&资讯平台 » my name is barry » 日志

arcgis api for flex 开发入门（四）Darw控件的使用

上一篇 / 下一篇 2008-10-15 11:07:00 / 个人分类：mushup

查看( 165 ) / 评论( 1 ) / 评分( 5 / 0 )

arcgis api for flex 开发入门（四）Darw控件的使用
arcgis api for flex 在客户端提供了强大的绘制功能，可以通过简单的调用来

完成复杂的绘制工作，达到很好的交互效果，提供完美的用户体验，感觉不出来

是在web上操作。
下面我们就一起来实现绘制功能。
首先，我们需要定义一个draw 控件，使用<esri:Draw>标签来完成创建工作，如

下面的代码
<esri:Draw id="drawToolbar" map="{myMap}"

graphicsLayer="{myGraphicsLayer}" />
6iRU|i0<esri:Draw >标签的map属性要绑定要你需要绘制的map上。graphicsLayer属性要

绑定到一个graphicsLayer上，所有绘制的结果都会添加到graphicsLayer上，

graphicsLayer的创建可以参考第二讲的内容。
7W[r2f.Y [^0控件创建好了，我们下面就可以调用这个控件的函数来完成绘制任务。
和上一讲一样，我们创建一个controlbar 来响应这些绘制的操作。
<mx:ControlBar horizontalGap="0" paddingBottom="0" paddingTop="0">
<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)" />
U C8pd7m |0 <mx:Button label="矩形" click="drawToolbar.activate

(Draw.EXTENT)" />
i;S&zgEU0 <mx:Button label="多边形" click="drawToolbar.activate

(Draw.POLYGON)" />
RwQ{B{G%zk0 <mx:Button label="流多边形" click="drawToolbar.activate

(Draw.FREEHAND_POLYGON) "/>
<mx:Button label="结束绘制" click="drawToolbar.deactivate

() "/>
</mx:ControlBar>

在button 的click 响应函数里，我们只需要调用draw控件的activate函数来激活

当前绘制工具就可以了。
K}N{/V7Te0当你不想绘制的时候，调用deactivate函数就ok了，释放掉当前选择的绘制工具

。
)w~6ZdG:IH0so easy，enjoy it；
效果：

e8].i(I-n sN0Flash:demo
1qbs$\ h%`0

完整代码：
<?xml version="1.0" encoding="utf-8"?>
<mx:Application
%qg7OpVt~I0    xmlns:mx="http://www.adobe.com/2006/mxml"
    xmlns:esri="http://www.esri.com/2008/ags"
    pageTitle="Using ArcGIS API for Flex to connect to a cached ArcGIS

Online service"
4A2}B2_ c0 styleName="plain">
<esri:Draw id="drawToolbar" map="{myMap}"

graphicsLayer="{myGraphicsLayer}" />
    <esri:SpatialReference id="sr" wkid="4326"/>
Yt9}+lt#d#P$`9M0     <mx:ControlBar horizontalGap="0" paddingBottom="0" paddingTop="0">
     <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)" />
4T:EtL#p)N)Wp0 <mx:Button label="流多边形" click="drawToolbar.activate

(Draw.FREEHAND_POLYGON) "/>
<mx:Button label="结束绘制" click="drawToolbar.deactivate

() "/>
R;n3H-q,D a%B{!Hi0      </mx:ControlBar>
    <esri:Map crosshairVisible="true" id = "myMap">
,n,}T5uWD!` aF2U0       <esri:extent>
  <esri:Extent id = "esriMapExtent" xmin="116"

ymin="39.5" xmax="116.5" ymax="40.5"/>
  </esri:extent>
&H.l5So r/zn[ ]!j0        <esri:ArcGISTiledMapServiceLayer

url="http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap

_World_2D/MapServer" />
<esri:GraphicsLayer id="myGraphicsLayer"

spatialReference="{sr}"/>
&mzq`8Uva#v/X.`0 </esri:Map>
</mx:Application>