Help needed on Flex Google Maps

[rajeshb_flash]

Hello Friends,

I need a small help in Flex Google Maps.

I got a sample from internet and when ever i am trying to compile i am getting the following errors like

Line 4:
Multiple markers at this line:
-Cannot resolve attribute 'top' for component type com.google.maps.Map.
-Cannot resolve attribute 'bottom' for component type com.google.maps.Map.
-Initializer for 'width': percentages are not allowed here.
-Cannot resolve attribute 'mapevent_mapready' for component type com.google.maps.Map.
Line 10:
The style 'dropShadowColor' is only supported by type 'mx.controls.TextInput' with the theme(s)
'halo'.

I dont know how to debug those nor correct it !! any help would be appreciated. i am attaching the mxml file as an attachment along with this. map_1_7a.swc and map_flex_1_7a.swc's are there inside lib's folder.


----------------------------
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:maps="com.google.maps.*" layout="absolute" viewSourceURL="srcview/index.html" creationComplete="getUsersIP()">

<maps:Map id="map" key="ABQIAAAAdgi2CSeDsX_VjUcSoNY4AhTG4zsmkSqhT03g2 Zpnsqk2caMCWRQdUD6OdsD2InVpj9z2hA5TipRNmg" mapevent_mapready="onMapReady(event)" width="100%" bottom="0" top="0"/>

<mx:ApplicationControlBar top="35" fillAlphas="[0.65, 1]" right="10">
<mx:VBox>
<mx:HBox>
<mx:Label text="Enter address: "/>
<mx:TextInput id="address" text="Adelaide AU" dropShadowColor="0x000000" enter="doGeocode(event);" />
<mx:Button label="Search" click="doGeocode(event);" />
</mx:HBox>
<mx:HBox>
<mx:Label text="Geo-locate IP address: "/>
<mx:TextInput id="ipAddress" dropShadowColor="0x000000" enter="doGeolocateIP(event);" />
<mx:Button label="Go" click="doGeolocateIP(event);" />
</mx:HBox>
</mx:VBox>
</mx:ApplicationControlBar>

<!-- <mx:ApplicationControlBar width="100%" dock="false" bottom="0" cornerRadius="0">
<mx:HBox width="100%" height="25">
<mx:Label text="More tools down here if requred"/>
<mx:TextInput id="address" text="Adelaide AU" dropShadowColor="0x000000" enter="doGeocode(event);" />
<mx:Button id="submitButton" label="Search" click="doGeocode(event);" />
</mx:HBox>
</mx:ApplicationControlBar>-->
<mx:Script>

<![CDATA[

import com.google.maps.Map;
import com.google.maps.LatLng;
import com.google.maps.MapEvent;
import com.google.maps.MapType;
import com.google.maps.controls.MapTypeControl;
import com.google.maps.controls.ZoomControl;
import com.google.maps.controls.PositionControl;
import com.google.maps.MapMouseEvent;
import com.google.maps.services.ClientGeocoder;
import com.google.maps.services.GeocodingEvent;
import com.google.maps.overlays.Marker;
import com.google.maps.overlays.MarkerOptions;
import com.google.maps.InfoWindowOptions;
import com.google.maps.styles.FillStyle;
import com.google.maps.styles.StrokeStyle;

import mx.rpc.http.HTTPService;
import mx.rpc.events.ResultEvent;
import mx.rpc.events.FaultEvent;
import mx.controls.Alert;
import mx.managers.CursorManager;

private var myService:HTTPService

private function onMapReady(event:Event):void {
//map.setCenter(new LatLng(40.736072,-73.992062), 14, MapType.NORMAL_MAP_TYPE);
map.setCenter(new LatLng(51.5, -0.11670000000001 ), 13, MapType.NORMAL_MAP_TYPE);
map.addControl(new ZoomControl());
map.addControl(new PositionControl());
map.addControl(new MapTypeControl());
map.enableScrollWheelZoom();
map.enableContinuousZoom();
}

private function doGeocode(event:Event):void {
// Geocoding example
var geocoder:ClientGeocoder = new ClientGeocoder("AU");
geocoder.addEventListener(
GeocodingEvent.GEOCODING_SUCCESS,
function(event:GeocodingEvent):void {
var placemarks:Array = event.response.placemarks;
if (placemarks.length > 0) {
map.setCenter(placemarks[0].point);
var marker:Marker = new Marker(placemarks[0].point);
marker.addEventListener(MapMouseEvent.CLICK, function (event:MapMouseEvent):void {
marker.openInfoWindow(new InfoWindowOptions({content: placemarks[0].address}));
});
map.addOverlay(marker);
}
});
geocoder.addEventListener(
GeocodingEvent.GEOCODING_FAILURE,
function(event:GeocodingEvent):void {
Alert.show("Geocoding failed");
trace(event);
trace(event.status);
});
geocoder.geocode(address.text);
}

private function doGeolocateIP(event:Event):void
{
map.closeInfoWindow();
map.clearOverlays();
useHttpService(ipAddress.text);
}

private function useHttpService(parameters:String):void {
myService = new HTTPService();
myService.url = "http://blog.wrench.com.au/wp-content/uploads/2008/12/geoip/sample_city.php";
myService.method = "POST";
myService.resultFormat = "flashvars";
myService.addEventListener("result", httpResult);
myService.addEventListener("fault", httpFault);
myService.send({iparameters});
CursorManager.setBusyCursor();
}

private function httpResult(event:ResultEvent):void {
var result:Object = event.result;
var latlng:LatLng = new LatLng(Number(result.latitude), Number(result.longitude));
var marker:Marker = new Marker(latlng);
var title:String;
if (result.city != "") {
title = "<b><font face='Arial' size='14'>" + result.city + "</font></b>";
} else {
title = "<font face='Arial' size='13'><i>Couldn't determine city</i></font>";
}
var myInfoWindowOptions:InfoWindowOptions = new InfoWindowOptions({titleHTML: title, content: result.country, pointOffset: new Point(0, -45), tailHeight: 0, hasShadow: false});
marker.addEventListener(MapMouseEvent.CLICK, function (event:MapMouseEvent):void {
map.openInfoWindow(latlng, myInfoWindowOptions);
});
map.openInfoWindow(latlng, myInfoWindowOptions);

map.addOverlay(marker);
map.setCenter(latlng);
CursorManager.removeBusyCursor();
}

private function httpFault(event:FaultEvent):void {
var faultstring:String = event.fault.faultString;
Alert.show(faultstring);
CursorManager.removeBusyCursor();
}

private function getUsersIP():void
{
myService = new HTTPService();
myService.url = "http://blog.wrench.com.au/wp-content/uploads/2008/12/geoip/usersIP.php";
myService.method = "POST";
myService.addEventListener("result", ipResult);
myService.addEventListener("fault", ipFault);
myService.send(parameters);
}

private function ipResult(event:ResultEvent):void {
ipAddress.text = event.result.toString();
//Do something with the result.
}

private function ipFault(event:FaultEvent):void {
var faultstring:String = event.fault.faultString;
Alert.show(faultstring);
}

]]>

</mx:Script>

</mx:Application>

[cancerinform]

First of all change the theme to the first Halo in the property section, since the Google examples use that style.

If you want to use Geocoding as an example check this code from Google:

http://code.google.com/p/gmaps-sampl...ingSimple.mxml.

You need to add a url
xmlns:maps="com.google.maps.*"
to the maps to bind the prefix "maps".