ArcGIS API for Flex实现GraphicsLayer上画点、线、面。
目的: ArcGIS API for Flex实现GraphicsLayer上画点、线、面。
准备工作: 1.这次地图数据就用Esri提供的http://server.arcgisonline.com/ArcGIS/rest/services/NPS_Physical_World_2D/MapServer。完成后的效果图:
ArcGIS.Server.9.3 ArcGIS API for Flex zclmj
21 / 80
开始: 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">
<mx:dataProvider>
<mx:Array>
<mx:Object icon="{point}" />
<mx:Object icon="{point2}" />
<mx:Object icon="{polyline3}" />
<mx:Object icon="{polyline}" />
<mx:Object icon="{polyline2}" />
<mx:Object icon="{polygon}" />
<mx:Object icon="{polygon2}" />
<mx:Object icon="{polygon3}" />
</mx:Array>
</mx:dataProvider>
</mx:ToggleButtonBar>
4.上面的代码中icon对应的图标定义在mx:Script中如下:
//图标图片
[Bindable]
[Embed(source="assets/point.gif")]
public var point:Class;
[Bindable]
[Embed(source="assets/point2.gif")]
public var point2:Class;
[Bindable]
[Embed(source="assets/polyline.gif")]
public var polyline:Class;
[Bindable]
[Embed(source="assets/polyline3.gif")]
public var polyline3:Class;
[Bindable]
[Embed(source="assets/polyline2.gif")]
public var polyline2:Class;
[Bindable]
[Embed(source="assets/polygon.gif")]
public var polygon:Class;
[Bindable]
[Embed(source="assets/polygon2.gif")]
public var polygon2:Class;
[Bindable]
[Embed(source="assets/polygon3.gif")]
public var polygon3:Class;
5.现在要实现在地图上画点、线等就需要esri:GraphicsLayer 的功能,实际上点、线、面都是画在GraphicsLayer的所以需要在Map控件中添加:
<esri:Map id="myMap" extent="{allMap}" logoVisible="false">
<esri:ArcGISTiledMapServiceLayer url="http://server.arcgisonline.com/ArcGIS/rest/services/NPS_Physical_World_2D/MapServer" />
<esri:GraphicsLayer id="myGraphicsLayer"/>
</esri:Map>
6.要进行绘制功能esri已经提供了esri:Draw这个控件能很方便的实现基本图形的绘制,使用代码如下:
<esri:Draw id="drawToolbar" map="{myMap}" graphicsLayer="{myGraphicsLayer}" />
7.esri:Draw有2个属性一个是要进行画图操作的地图控件,一个是画图的容器GraphicsLayer 。
8.接下来定义一下画出来的点、线、面的显示样式,代码如下:
<esri:SimpleLineSymbol id="sls" style="solid" color="0xFF0000" width="2" alpha="1"/>
<esri:SimpleMarkerSymbol id="sms" style="square" color="0xFF0000" size="10" />
<esri:SimpleFillSymbol id="sfs" style="solid" color="0xFF0000" alpha="0.5"/>
9.上面的sls为线的显示样式;sms为点的显示样式;sfs为面的显示样式,关于样式的定义可以查询一下帮助了有很多的样式等可以实现。
10.最后就是编写功能代码在上面的ToggleButtonBar控件中已经给它添加了一个itemClick="itemClickHandler(event)",这里就是编写itemClickHandler(event)这个方法的代码:
import mx.events.ItemClickEvent;
private function itemClickHandler(event:ItemClickEvent):void
{
//设置点样式
drawToolbar.markerSymbol=sms;
//设置线样式
drawToolbar.lineSymbol=sls;
//设置面样式
drawToolbar.fillSymbol=sfs;
//更加按钮的index值设置不同的绘制操作
switch(event.index)
{
case 0:
{
drawToolbar.activate(Draw.MAPPOINT);
break;
}
case 1:
{
drawToolbar.activate(Draw.MULTIPOINT);
break;
}
case 2:
{
drawToolbar.activate(Draw.LINE);
break;
}
case 3:
{
drawToolbar.activate(Draw.POLYLINE);
break;
}
case 4:
{
drawToolbar.activate(Draw.FREEHAND_POLYLINE);
break;
}
case 5:
{
drawToolbar.activate(Draw.POLYGON);
break;
}
case 6:
{
drawToolbar.activate(Draw.FREEHAND_POLYGON);
break;
}
case 7:
{
drawToolbar.activate(Draw.EXTENT);
break;
}
}
}
ArcGIS API for Flex实现GraphicsLayer上画点、线、面。的更多相关文章
- 天津政府应急系统之GIS一张图(arcgis api for flex)讲解(十)态势标绘模块
config.xml文件的配置如下: <widget label="态势标绘" icon="assets/images/impact_area_over.png&q ...
- arcgis api for flex之专题图制作(饼状图,柱状图等)
最近公司给我一个任务,就是利用arcgis api for flex实现在地图上点(业务数据)直接显示饼状图以及柱状图的专题图制作,而不是通过点击点显示气泡窗口的形式来实现,这个公司已经实现了. 经过 ...
- Clustering with the ArcGIS API for Flex
Clustering is an excellent technique for visualizing lotss of point data. We've all seen application ...
- 天津政府应急系统之GIS一张图(arcgis api for flex)讲解(一)GIS一张图的系统开发环境以及flexviewer框架
系统的GIS功能实现是基于arcgis api for flex,首先附上系统的主界面图,接下来的是对主界面的模块功能详细讲解: 一.GIS环境软件安装 (1)arcgis desktop的安装,要是 ...
- arcgis api for flex 开发入门(一)环境搭建
http://www.cnblogs.com/wenjl520/archive/2009/06/02/1494514.html arcgis api for flex 开发入门(一)环境搭建arcgi ...
- ArcGIS API for Silverlight 地图元素点闪烁,线流动显示的处理方式
原文:ArcGIS API for Silverlight 地图元素点闪烁,线流动显示的处理方式 <Grid x:Name="LayoutRoot" Background=& ...
- 天津政府应急系统之GIS一张图(arcgis api for flex)讲解(十三)台风模块
config.xml文件的配置如下: <widget label="台风" icon="assets/images/typhoon.png" config ...
- 天津政府应急系统之GIS一张图(arcgis api for flex)讲解(十一)路径导航模块
config.xml文件的配置如下: <widget label="路径导航" icon="assets/images/lujingdaohang.png" ...
- ArcGIS API Reference & Flex API samples学习进度备忘
书签:跳过:另外跳过的内容有待跟进 __________________学习资源: 1.http://help.arcgis.com/en/webapi/flex/apiref/index.html ...
随机推荐
- Nagios NSclient Failed to get CPU value: \238(_total)\6: Failed to get mutex :(
一台Windows Server 2012的nsclient出现以下的错误,表示无法获得CPU信息 2016-08-08 10:31:33: e:..\..\..\..\trunk\modules\C ...
- 如何在JBoss WildFly 8 自定义log4j日志
最近在 JBoss WildFly 8 下部署 Web应用,自定义的 log4j 日志不工作.console下无日志输出,用System.out.println都不输出内容到console. 原因是J ...
- JAVA中精确计算金额BigDecimal
package com.chauvet.utils; import java.math.BigDecimal; import java.text.DecimalFormat; import java. ...
- 什么是JavaEE
Java技术不仅是一门编程语言而且是一个平台.同时Java语言是一门有着特定语法和风格的高级的面向对象的语言,Java平台是Java语言编写的特定应用程序运行的环境.Java平台有很多种,很多的Jav ...
- 有向图强连通分量 Tarjan算法
[有向图强连通分量] 在有向图G中,如果两个顶点间至少存在一条路径,称两个顶点强连通(strongly connected).如果有向图G的每两个顶点都强连通,称G是一个强连通图.非强连通图有向图的极 ...
- VS2013添加使用lib的方法
使用第三方厂家的库,一般都会有三个文件: xxx.h xxx.lib xxx.dll 头文件很明显,就在需要用到的文件里面include就好. lib文件,可以直接在IDE中添加,具体步骤有两个: 1 ...
- LNMP编译安装教程
LNMP编译安装教程 此次安装在Centos上,我采用的CentOS的版本是:CentOS release 6.5 (Final) 可以通过以下命令查看:lsb_release -a 一.准备工作: ...
- C# 操作Word知识汇总
转自:http://blog.csdn.net/jiutao_tang/article/details/6574740 1. 微软官方实例: 段落.表格.图表 HOW TO:利用 Visual C# ...
- .NET异常问题总结
输入字符串的格式不正确. 有格式化字符替换符号{0}等,“{”和“}”作为特殊符号出现,如果有多余的“{”和“}”就会出错 GZIP压缩出现FF-F0-F1…是无效的输入流 要解压的字节流无效,可能是 ...
- 【MySQL】探究之常用SQL
一些SQL命令(不断更新,我总记不住,哭) List 建库建表 表的重命名(不区分大小写) 列的重命名 编码 修改结构 添加删除索引 大批量删除 binlog相关 select相关 数据库备份和恢复 ...