FLEX AS3.0 百度地图

时间:2023-02-05 15:20:43

window xp系统 FlashBuilder4.5

先上百度下载flash api 下载地址http://developer.baidu.com/map/flash.htm

新建一个flex项目

右键项目→属性→Flex构件路径   导入BMap.swc(下载的flash api)

FLEX  AS3.0  百度地图

map1.mxml

 <?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
xmlns:maps="com.earthplayer.maps.*"
creationComplete="init()"
width="1200"
height="700"
x="0" y="0"
>
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
<mx:HTTPService id="myService" url="area.xml" />
</fx:Declarations>
<fx:Script>
<![CDATA[
import baidu.map.basetype.LngLat;
import baidu.map.basetype.Size;
import baidu.map.control.base.Navigator;
import baidu.map.control.base.Overview;
import baidu.map.control.base.Ruler;
import baidu.map.control.base.Scaler;
import baidu.map.core.Map;
import baidu.map.layer.Layer;
import baidu.map.layer.RasterLayer;
import baidu.map.overlay.InfoWindow;
import baidu.map.overlay.Label;
import baidu.map.overlay.Marker;
import baidu.map.overlay.geometry.Circle;
import baidu.map.overlay.geometry.Polygon;
import baidu.map.overlay.geometry.Polyline;
import baidu.map.symbol.CircleSymbol;
import baidu.map.symbol.PolygonSymbol;
import baidu.map.symbol.PolylineSymbol; import mx.collections.ArrayCollection;
import mx.core.UIComponent;
import mx.events.FlexEvent;
import mx.messaging.channels.StreamingAMFChannel; import spark.events.IndexChangeEvent; [Bindable]
public var store_st:ArrayCollection = new ArrayCollection(
[
{status:"玫瑰园"},
{status:"北京"},
{status:"上海"},
{status:"广州"},
{status:"深圳"},
{status:"佛山"},
{status:"南宁"},
{status:"南京"},
{status:"海口"},
{status:"哈尔滨"},
{status:"吉林"},
{status:"长春"},
{status:"天津"},
{status:"石家庄"},
{status:"郑州"},
{status:"西安"},
{status:"长沙"},
{status:"武汉"},
{status:"成都"},
{status:"香港"},
{status:"杭州"},
]
); public function init():void{
config();
} private function config():void{
const request:URLRequest = new URLRequest("area.xml");
const loader:URLLoader = new URLLoader(request);
loader.addEventListener(Event.COMPLETE, loader_completeHandler);
function loader_completeHandler(event:Event):void{
var configXML:XML = XML(loader.data);
for each (var i:XML in configXML.store_name){
if (store_cb.text==i.@id.toString()){
var x:Number=i.store_x.toString();
var y:Number=i.store_y.toString();
}
}
map(x,y);
}
} public function map(x:Number,y:Number):void{
// 创建一个大小为600*400的Map对象
var map:Map = new Map(new Size(Cs.width, Cs.height))
var uc:UIComponent = new UIComponent();
uc.addChild(map);
Cs.addChild(uc); //addElement(uc);
//Gp.addElement(uc); 如果是Group容器就用这个 // 初始化Map的中心点和显示级别
map.centerAndZoom(new LngLat(x,y), 12); // 添加底图
var layer:Layer = new RasterLayer("BaiduMap", map);
map.addLayer(layer); //添加定位标志
var marker:Marker = new Marker();
marker.position = new LngLat(x,y);
map.addOverlay(marker); // 添加Overview 缩略图控件
var overview:Overview = new Overview(map);
map.addControl(overview); // 添加Navigator平移控件
var nav:Navigator = new Navigator(map);
map.addControl(nav); // 添加Scaler 缩放控件
var scaler:Scaler = new Scaler(map);
map.addControl(scaler); // 添加Ruler 比例尺控件
var ruler:Ruler = new Ruler(map);
map.addControl(ruler); //添加文本标签
var label:baidu.map.overlay.Label = new baidu.map.overlay.Label(store_cb.selectedLabel);
label.position = new LngLat(x,y+0.02);
label.contentStyle = new TextFormat("宋体", 14, 0xff0000, true);
map.addOverlay(label); } public function refresh():void{
store_cb.selectedIndex = 0;
map(113.061539,22.885359);
} ]]>
</fx:Script>
<s:layout>
<s:VerticalLayout paddingLeft="5" paddingRight="5" paddingTop="5" paddingBottom="5"/>
</s:layout> <s:VGroup width="100%" height="100%">
<s:HGroup width="100%" horizontalAlign="right" verticalAlign="middle">
<s:Spacer width="100%"/>
<s:Label text="门店:"/>
<mx:ComboBox id="store_cb" dataProvider="{store_st}" labelField="status" selectedIndex="0" editable="true"/>
<s:Button id="sreach_btn" label="搜索" click="init()"/>
<s:Button id="refresh_btn" label="刷新" click="refresh()"/>
</s:HGroup> <mx:Canvas id="Cs" borderStyle="solid" width="100%" height="100%">
</mx:Canvas>
</s:VGroup>
</s:WindowedApplication>

area.xml

 <?xml version="1.0" encoding="UTF-8"?>
<Store>
<store_name id="玫瑰园">
<store_x>113.061539</store_x>
<store_y>22.885359</store_y>
</store_name>
<store_name id="北京">
<store_x>116.395645</store_x>
<store_y>39.929986</store_y>
</store_name>
<store_name id="上海">
<store_x>121.487899</store_x>
<store_y>31.249162</store_y>
</store_name>
<store_name id="广州">
<store_x>113.30765</store_x>
<store_y>23.120049</store_y>
</store_name>
</Store>

FLEX  AS3.0  百度地图

结果:

FLEX  AS3.0  百度地图