相信看到这篇的朋友,应该用我前三篇的例子玩过这个地图API了,知道地图显示,切换等。下一步就是很重要的加标记,首先,你需要的是把我第三篇
写的代码抄出来,接着就是在以前的SCRIPT代码段里加上我下面写的代码。该解释的我已经在代码里说了。
我们先要加两个按钮,一个是用来增加标记,一个是用来删减标记。代码为:
<mx:Canvas width="214" height="25" x="181" y="370" backgroundColor="#ff0000" backgroundAlpha=".5">
<mx:LinkBar dataProvider="mapStack" />
</mx:Canvas>
<!-- 这里就是新增加的东东,增加是调用addMarkers(),删除是调用removeMarkers()-->
<mx:Button label="增加标注" click="addMarkers()" fontSize="12" fontWeight="normal" y="372" x="8"/>
<mx:Button label="删除标注" click="removeMarkers()" fontSize="12" fontWeight="normal" y="372" x="73"/>
你可以注意到我把以前CANVAS的代码段也贴上来了,为了便于排布组件,否则光贴两个按钮的,到时候跟切换地图的组件重叠了,我好人做到底,一起贴了。
下面的代码是加在以前SCRIPT代码段里的,别忘了是加上。
import mx.collections.ArrayCollection;
import mx.controls.Image;
import com.earthplayer.maps.MapDisplayObject;
//先来个数组合集,目的是用来保存那些标记点,当然是存在内存里,如果想狠点,就直接跟数据库来连,当然教程里就是存内存
[Bindable]
private var currentInfos:ArrayCollection = new ArrayCollection();
[Embed(source="assets/icons/biao.png")]
public var biao:Class;
//增加标记,其实就是在某个点(你感觉兴趣的位置),加几个图,或者其他什么东西,我这里是加image
private function addMarkers():void{
//我准备加的是IMAGE,所以下面几项是设置。很简单,如果你想来点复杂的,自己搞个组件也可以。
var icon:Image = new Image();
icon.source = biao;
icon.toolTip = "那里有美女";
icon.buttonMode = true;
icon.useHandCursor = true;
//下面是一个MapDisplayObject,干嘛用呢?就是源码设置好的,看名字就知道了,有几个属性
//你仔细看下,其实跟那个中心点差不多,MapDisplayObject的中心点根据的是currentLngLat的X与Y的数据
//而anchor这个属性是因为我的ICON的大小是20*20,别忘了注册点是左上,所以要使图片在中心需要向前各进10.
//最后就是把这个标记的数据扔到预先设立好的ArrayCollectioni里。
var mapObject:MapDisplayObject = new MapDisplayObject();
mapObject.lnglat.y = currentLngLat.y;
mapObject.lnglat.x = currentLngLat.x;
mapObject.displayObj = icon;
mapObject.anchor.x = 10;
mapObject.anchor.y = 10;
currentInfos.addItem(mapObject);
renderMarkers();
}
//下面就是用来在地图上显示标记的,上面这个是加,然后保存到数组,是抽象,下面是具体实施。
private function renderMarkers():void{
if(currentInfos.length >0){
var map:MapCanvas = mapStack.selectedChild as MapCanvas;
map.removeAllObjectsFromMap();
for(var i:int=0;i<currentInfos.length;i++){
var mapObject:MapDisplayObject = currentInfos.getItemAt(i) as MapDisplayObject;
map.addObjectToMap(mapObject);
}
}
}
//用 removeAllObjectsFromMap命令清空图标,然后currentInfos.removeAll();同时清空数组
private function removeMarkers():void{
var map:MapCanvas = mapStack.selectedChild as MapCanvas;
map.removeAllObjectsFromMap();
currentInfos.removeAll();
}
renderMarkers()这个命令是显示标记的,如果光是在以前的代码上加上上面这段代码,在不放大缩小地图的时候,标记是没问题的,如果
你一放大或者缩小,标记就不见了,那么问题是在哪里呢?就是在showMap()这个命令里,你还需要在里面加上renderMarkers(),所以最
后的是:
private function showMap():void{
(mapStack.selectedChild as MapCanvas).setCenter(currentLngLat,zoom.value);
renderMarkers()
}
分享到:
相关推荐
FLEX地图应用教程对于flex地图开发的初学者很有用。
整套Flex地图教程,都整合成了PPT,讲解详细,易懂
flex地图应用开发教程,地图玩家SWC API,flex地图开发项目源代码
详细讲解了利用earthplayerlib和google、live地图、51地图开发flex地图应用的过程。包含了许多细节和技巧。 教程整理成ppt形式。
FLEX地图应用教程,讲述了如何使用百度地图构建webGIS应用程序。
FLEX中地图的应用 地球物理地图FLEX中地图的应用 地球物理地图
flash和flex地图API以及相关word文档式教程 文档是介绍如何在flex使用
Flex 4 ColumnChart 图表使用实例ColumnChart_RIA前线-Flex富应用、Flex中文教程、Flex实例源码 Flex实现ColumnChart柱图为圆角矩形的itemRenderer - 代码分享 - 开源中国社区 flex 动态生成柱状图,折线图_IT空间_...
panArrowsVisible:true/false 是否在地图的四边以及4个角显示移动地图箭头按钮的功能。panEnabled:true/false 是否开启拖拽地图移动的功能。rubberBandZoomEnabled:true/false 是否开启按shift+拉框放大地图的...
使用 arcgis api for flex 可以达到下面的效果 1,显示你的地图数据并可以和数据交互 2,在服务器上执行空间处理模型并显示结果 3,基于ArcGIS Online 上的底图显示你自己的数据 4,根据属性或者位置查找你的数据并...