The Google Maps API has been out here quit a while, but it’s nice to discover this service. I always made use of the Yahoo maps API, which I briefly described in a prevouis post. Although the Google Maps API does the same as the Yahoo map API, there is 1 service that Yahoo doesn’t provide: the driving direction service. But let’s get started with the basics.
Get your Google Maps API key here.
Download the Flex and Flash component SWC here.
The Google Maps official resource site, provides all the information that can be accomplished with this API. As in this post I will only show other on how to initialize the map inside your Flash content.
Google Maps API for Flex
The great thing with Flex is that we can easily create a MXML Map component and address it by it’s id name.
[code lang="actionscript"]
import com.google.maps.controls.MapTypeControl;
import com.google.maps.controls.ZoomControl;
import com.google.maps.LatLng;
import com.google.maps.Map;
import com.google.maps.MapEvent;
import com.google.maps.MapType;
private function onMapReady(event:Event):void {
this.map.setCenter(new LatLng(50.736072,4.2102), 8, MapType.SATELLITE_MAP_TYPE);
this.map.addControl(new ZoomControl());
this.map.addControl(new MapTypeControl());
}
]]>
[/code]
Example , Download Flex Project
Google Maps API for Flash CS3
First off all, we will need to copy the map_1_16.swc that we downloaded from the Google Maps API resource website to the following directory…
MAC
Macintosh HD/Applications/Adobe Flash CS3/Configuration/Components
WIN
C:\Program Files\Adobe\Adobe Flash CS3\language\Configuration\Components
If you did this while the Flash CS3 was opened, you will need to restart the software…
Now drag a new Google Map component from the component list (Google > GoogleMapsLibrary) to the stage, and give it the instance name: “map”.
With following code you will get your Google Maps added to your Flash SWF …
[code lang="actionscript"]import com.google.maps.controls.MapTypeControl;
import com.google.maps.controls.ZoomControl;
import com.google.maps.LatLng;
import com.google.maps.Map;
import com.google.maps.MapEvent;
import com.google.maps.MapType;
var map:Map = new Map();
map.key = "your_api_key";
map.setSize(new Point(stage.stageWidth, stage.stageHeight));
map.addEventListener(MapEvent.MAP_READY, onMapReady);
this.addChild(map);
function onMapReady(event:Event):void {
map.setCenter(new LatLng(50.736072,4.2102), 8, MapType.NORMAL_MAP_TYPE);
map.addControl(new ZoomControl());
map.addControl(new MapTypeControl());
}[/code]
Now that we are able to add a standard Google Map to our Flash / Flex projects, we can now start to discover the side services and possibilities. More posts in short notice …
Also interesting reads:
Daan is a Creative-Geek with passion for Adobe Flash , Flex and Air. He loves learning and sharing new techniques! Follow him on
that’s also cool to integrate it with flash map component so we could see the city map and domestic airlines.
Ohio, what a good evil plan to get followers. And I like it
It’s really a nice and useful piece of info. I am glad that you shared this useful info with us. Please keep us up to date like this. Thank you for sharing.
Thank you for your entire efforts on this blog. My aunt takes pleasure in participating in investigations and it is easy to see why. We notice all about the powerful manner you create helpful guidance by means of this website and therefore invigorate contribution from the others on that topic and my simple princess is now understanding a whole lot. Have fun with the rest of the new year. You’re doing a tremendous job.