Google Maps in Flash with the Flex SDK and haXe
May 23rd, 2009 by admin | No Comments | Filed in mashupsand getting it to work together.. seems like people have a lot of issues with this, so here are the steps you have to take.
If you do not have an API key, sign up for one here.
This way of installing haXe is pretty bad and should be avoided, but it made it easy swapping haXe versions fast.
I use the haXe version 1.19 together with the Google Maps Flash API.
Lets first get haXe and the Googles Flash API
root@devbox:/usr/local/src$ mkdir flashdevelopment
root@devbox:/usr/local/src$ cd flashdevelopment/
root@devbox:/usr/local/src/flashdevelopment$ wget -q \http://maps.googleapis.com/maps/flash/release/sdk.zip
root@devbox:/usr/local/src/flashdevelopment$ wget -q \
http://haxe.org/file/haxe-1.19-linux.tar.gz
root@devbox:/usr/local/src/flashdevelopment$ unzip -q sdk.zip
root@devbox:/usr/local/src/flashdevelopment$ tar -zxf \
haxe-1.19-linux.tar.gz
To make haXe work:
root@devbox:/usr/local/src/flashdevelopment$ cd haxe-1.19-linux
root@devbox:/usr/local/src/flashdevelopment/haxe-1.19-linux$ cp haxe /usr/bin/
root@devbox:/usr/local/src/flashdevelopment/haxe-1.19-linux$ cp haxelib /usr/bin
root@devbox:/usr/local/src/flashdevelopment/haxe-1.19-linux$ cp haxedoc /usr/bin/
root@devbox:/usr/local/src/flashdevelopment/haxe-1.19-linux$ mkdir /usr/lib/haxe
root@devbox:/usr/local/src/flashdevelopment/haxe-1.19-linux$ ln -s /usr/local/src/flashdevelopment/haxe-1.19-linux/std/ /usr/lib/haxe
Now we need to generate hxclasses from the SDK to make it usable in haXe
root@devbox:/usr/local/src/flashdevelopment$ cd lib
root@devbox:/usr/local/src/flashdevelopment/lib$ mv map_1_9.swc map_1_9.zip
root@devbox:/usr/local/src/flashdevelopment/lib$ unzip map_1_9.zip
Archive: map_1_9.zip
inflating: library.swf
inflating: catalog.xml
root@devbox:/usr/local/src/flashdevelopment/lib$ haxe –gen-hx-classes library.swf
Now, there are some changes that has to made to make haXe like the API
I generated the working sources with a newer version of haXe, and applied the changes to it.
This makes the patchfile a bit larger than it had to be, because I had to make a patch against my haxe 1.19-generated hxclasses/ folder.
Anyways, this works and it is against the 1.9 file from Google.
root@devbox:/usr/local/src/flashdevelopment/lib$ wget -q \
http://arpa.no/googlemaps.diff
root@devbox:/usr/local/src/flashdevelopment/lib$ patch -p0 < \
googlemaps.diff
Clean up a bit so we can just develop here:
root@devbox:/usr/local/src/flashdevelopment$ rm lib/map_*
root@devbox:/usr/local/src/flashdevelopment$ rm haxe-1.19-linux.tar.gz sdk.zip
Lets try to create just a simple map, this file will be /usr/local/src/flashdevelopment/MyMap.hx
import com.google.maps.Map;
import com.google.maps.MapEvent;
import com.google.maps.LatLng;
import com.google.maps.MapType;
import com.google.maps.controls.ZoomControl;
import com.google.maps.controls.MapTypeControl;
import com.google.maps.controls.PositionControl;class MyMap extends Map {
static function main() {
var app:MyMap = new MyMap();
flash.Lib.current.addChild(app);
app.setSize(new flash.geom.Point(400,400));
}public function new(){
super();
addEventListener(MapEvent.MAP_READY, onMapReady);
}private function onMapReady(event:MapEvent) {
setCenter(new LatLng(40.416740,-3.703250), 2, MapType.NORMAL_MAP_TYPE);
setZoom(2,false);
addControl(new ZoomControl());
addControl(new PositionControl());
addControl(new MapTypeControl());
}}
Now we need to make a way for haXe to understand how to compile this with the API, so this is the contents of:
/usr/local/src/flashdevelopment/compile.hxml
-swf map.swf
-swf-version 9
-cp lib/hxclasses/
-swf-lib lib/library.swf
-main MyMap
Use haXe to compile this map into an SWF:
root@devbox:/usr/local/src/flashdevelopment$ haxe compile.hxml
root@devbox:/usr/local/src/flashdevelopment$
Voila! Your first Google Flash Map, fresh from the oven.. the filename is map.swf
Try to include this on a webpage, check the source here if you don’t know how to do it.
Your API key should be in the flashvars when applying the flash object on a webpage.
<param name=”flashvars” value=”key=key”/>
Here is my result, I messed up the width/height of my app, but it works:
Hope someone can have use out of this!
Tags: api, flash, google maps, haXe

Follow me on Twitter