LetsFlex

google maps: geocoding service

by jlagunas on Aug.26, 2008, under Google Maps

The following example shows you an introduction to google’s map geocoding service to find your address from an xml file.

note: you will need to download the Google Maps API for Flash SDK.

 

MXML File

<?xml version="1.0" encoding="utf-8"?>
	<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" width="100%" height="100%" layout="absolute" initialize="initializeHandler(event);" viewSourceURL="srcview/index.html">
		<mx:Script>
			<![CDATA[
				import mx.controls.Alert;
				import mx.events.ResizeEvent;
				import mx.rpc.events.ResultEvent;
				import mx.rpc.events.FaultEvent;
				import com.google.maps.InfoWindowOptions;
				import com.google.maps.overlays.Marker;
				import com.google.maps.services.Placemark;
				import com.google.maps.services.GeocodingEvent;
				import com.google.maps.services.GeocodingResponse;
				import com.google.maps.services.ClientGeocoder;
				import com.google.maps.MapMouseEvent;
				import com.google.maps.LatLng;
				import com.google.maps.MapEvent;
				import com.google.maps.Map;

				private var map:Map;
				private var geocoder:ClientGeocoder;
				private var marker:Marker;
				private var xmlRequest:URLRequest;
				private var xmlLoader:URLLoader;
				private var xml:XML;
				private var xmlList:XMLList;
				private var companyName:String;
				private var companyAddress:String;
				private var companyCity:String;
				private var companyState:String;
				private var companyZip:String;
				private var titleFormat:TextFormat;
				private var contentFormat:TextFormat;

				private function initializeHandler(event:Event):void
				{
					map = new Map();
					map.key = "PLACE YOUR API KEY HERE";
					map.addEventListener(MapEvent.MAP_READY, mapReadyHandler);

					mapComponent.addChild(map);
				}

				private function mapReadyHandler(event:MapEvent):void
				{
					xmlRequest = new URLRequest("address.xml");
					xmlLoader = new URLLoader(xmlRequest);
					xmlLoader.addEventListener("complete", xmlLoaderHandler);
				}

				private function xmlLoaderHandler(event:Event):void
				{
					xml = new XML(event.target.data);
					xmlList = xml..marker;

					companyName = xmlList.@name;
					companyAddress = xmlList.@address;
					companyCity = xmlList.@city;
					companyState = xmlList.@state;
					companyZip = xmlList.@zip;

					geocoder = new ClientGeocoder();
					geocoder.addEventListener(GeocodingEvent.GEOCODING_SUCCESS, geocodingSuccessHandler);
					geocoder.addEventListener(GeocodingEvent.GEOCODING_FAILURE, geocodingFailureHandler);
					geocoder.geocode(companyAddress + " " + companyCity + ", " + companyState + " " + companyZip);
				}

				private function geocodingSuccessHandler(event:GeocodingEvent):void
				{
					marker = new Marker(GeocodingResponse(event.response).placemarks[0].point);
					marker.addEventListener(MapMouseEvent.CLICK, markerClickHandler);

					map.addOverlay(marker);
					map.setCenter(GeocodingResponse(event.response).placemarks[0].point, 11);
				}

				private function geocodingFailureHandler(event:GeocodingEvent):void
				{
					Alert.show("can not locate: " + event.name);
				}

				private function markerClickHandler(event:MapMouseEvent):void
				{
					titleFormat = new TextFormat();
					titleFormat.font = "Arial";
					titleFormat.size = 14;
					titleFormat.bold = true;

					contentFormat = new TextFormat();
					contentFormat.font = "Arial";
					contentFormat.size = 12;

					var infoWindow:InfoWindowOptions = new InfoWindowOptions();
					infoWindow.title = companyName;
					infoWindow.titleFormat = titleFormat;
					infoWindow.content = companyAddress + "n" + companyCity + ", " + companyState + " " + companyZip;
					infoWindow.contentFormat = contentFormat;
					infoWindow.padding = 10;
					infoWindow.width = 250;
					infoWindow.height = 100;

					marker.openInfoWindow(infoWindow);
				}

				private function mapResizeHandler(event:ResizeEvent):void
				{
					map.setSize(new Point(mapComponent.width, mapComponent.height));
				}
			]]>
		</mx:Script>

		<mx:UIComponent id="mapComponent" width="100%" height="100%" resize="mapResizeHandler(event);" />

	</mx:Application>

XML File

<?xml version="1.0" encoding="UTF-8"?><markers>
	<marker name="ad2, Inc." address="1990 e. grand ave" city="el segundo" state="ca" zip="90245" />
</markers>
:, ,
5 comments for this entry:
  1. Recent Links Tagged With "geocoding" - JabberTags

    [...] public links >> geocoding google maps geocoding service Saved by ChurchCommunicationsProco on Tue 04-11-2008 Reverse Geocoding Saved by IM204spring08 on [...]

  2. mark

    How to do an image with contentHTML to the infoWindow?
    IE does not seem to like it.

  3. jlagunas

    using the customContent parameter will definitely work with adding an image to your infoWindow but there is still an issue with adding strings into that customContent since its only used for a DisplayObject.

    a possible solution would be here:
    http://www.marcusschiesser.de/?p=77

Leave a Reply

Looking for something?

Use the form below to search the site:

Still not finding what you're looking for? Drop a comment on a post or contact us so we can take care of it!

Visit our friends!

A few highly recommended friends...

Archives

All entries, chronologically...