flex实现googelMap

之前看很多FLEX网站做出的MAP效果，觉得非常棒！自己试着也做出了一个MAP效果。

1：首先安装sdk,如果是FB就更加方便了，我这用的是FB。
2:下载Google 提供的flex google map工具包，我在附件中提供这个工具包（有map_flex_1_1.swc和他的接口架构），我在附件中已经加上了，不必再找。
3:需要有一个Google map 提供的 API key 在http://code.google.com/apis/maps/signup.html apply。
注册的时候最好是用http://localhost注册，这样你本地测试就OK！
4:现在就可以建立一个project，把map_flex_1_1.swc导入到你的project library中。
下面我借个软件开发经典的“hello world”来说明。（在Google的官方网站有这个例子）
创建一个mxml文件，代码如下：
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="100%" height="100%">
  <mx:Panel title="Google Maps API for Flash - Simple Map" width="100%" height="100%">
    <mx:UIComponent id="mapContainer" 
        initialize="startMap(event);" 
        resize="resizeMap(event)" 
        width="100%" height="100%"/>
  </mx:Panel>
  <mx:Script>
    <![CDATA[
import flash.events.Event;
import com.google.maps.MapEvent;
import com.google.maps.Map;
import com.google.maps.MapType;
import com.google.maps.LatLng;

  private var map:Map;

  public function startMap(event:Event):void {
    map = new Map();
    map.addEventListener(MapEvent.MAP_READY, onMapReady);
    mapContainer.addChild(map);
    map.key="ABQIAAAAIhwqRCxr2Hd_iUrIB7KzdxT2yXp_ZAY8_ufC3CFXhHIE1NvwkxR4G7tD76snbpNjQ3DrJkhKe_noZg";
  }
      
  public function resizeMap(event:Event):void {
    map.setSize(new Point(mapContainer.width, mapContainer.height));
  }
  
  private function onMapReady(event:MapEvent):void {
    map.setCenter(new LatLng(37.4419, -122.1419), 14, MapType.NORMAL_MAP_TYPE);
  }
    ]]>
  </mx:Script>
</mx:Application>

运行一下！！

http://www.riachina.com/showtopic-6580.html

评论

3 楼 qing_feixiang 2011-04-04  

步骤很详细，很有用，谢谢了！！！

2 楼 josengg 2010-06-30  

3D街景效果 有提供相应的API么？

1 楼 ioryioryzhan 2008-07-04  

美女做的界面果然漂亮一点，我就不会放个panel，直接一个UIComponent就完了，哈哈