Yahoo Maps API

Myślę, że swój blog mógłbym poświęcić o programowaniu map geograficznych. To wszystko przez to że wyszukiwarka Google traktuje mój artykuł o mashupach z mapami geograficznymi za bardzo interesujący i sporo ludzi trafia na ten artykuł.

Jak do tej pory nikt jeszcze nie pokusił się o napisanie komponentu do ActionScript 3 / Flex 2 / Flash cs3. Mimo że są w internecie komponenty do ActionScript 2 (Yahoo Maps i GMap)

W tej sytuacji warto zwrócić uwagę na to jak wygląda współpraca aplikacji napisanych w Flex 2 stosujących biblioteki ActionScript 2 na przykładzie .

Otóż cała komunikacja pomiędzy aplikacją a biblioteką przechodzi przez LiveConnection. Wymusza to na programiście ActionScript 3 klas mapujących które miałyby wywoływać metody z komponentu ActionScript 2 . Programista komponentu ActionScript 2 musi też zadbać o to żeby możliwa była komunikacja pomiędzy jego komponentem a kodem aplikacji Flex 2 poprzez LiveConnection.

W dokumentacji Adobe można przeczytać o tym.

Jak użyć mapki Yahoo w aplikacji Flex 2?

To proste trzeba pobrać Yahoo! AS3 API Libraries (do pobrania stąd), a następnie zarejestrować się w celu uzyskania Yahoo API Key. Po pobraniu i rozpakowaniu warto przejrzeć się kodom aplikacji yahoo\examples\maps są tam 3 przykłady. Najważniejszy za punktu widzenia jest przykład yahoo\examples\maps\all-functionality\howtoMapsASExAllFuntionality.mxml

Więcej informacji o konfiguracji Adobe Flex Buildera 2 do współpracy z tymi bibliotekami można zobaczyć w tym artykule. Jest też artykuł wprowadzający w tworzenie aplikacji Flex 2 przy wykorzystaniu Yahoo! Maps AS3 Communication Kit

Poniżej zamieszczam kod prostej aplikacji wskazującej na siedzibę firmy Enzo z markerem

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
xmlns:yahoo="com.yahoo.webapis.maps.*" layout="absolute"
creationComplete="init();">
<mx:Script>
<![CDATA[
import flash.utils.getTimer;
import mx.controls.Alert;
mport com.yahoo.webapis.maps.methodgroups.*;
private const SWFDOMID:String = "Enzo";
private const UNIQUEID:int = getTimer();
private const YAHOOAPIKEY:String = "TwójKluczAPI";
private const MAPSWF:String = "as2map.swf";

private function init():void {
myAS2Map.addEventListener('onMapLoad', onMapLoaded);
myAS2Map.addEventListener('onMapError', onMapError);
}

private function onMapLoaded(ev:Object):void {
var panTools:PanTool = new PanTool(myAS2Map);
panTools.setPanTool(true);
var widgets:Widgets = new Widgets(myAS2Map);
widgets.showNavigatorWidget();
widgets.showSatelliteControlWidget();
var myMarker:Object;
var mapController:MapController = new MapController(myAS2Map);
var latLonController:LatLonController = new
LatLonController(myAS2Map);
latLonController.setCenterByLatLonAndZoom(
Number(51.2294091060463),
Number(22.5725913047791),
4,
0);
myMarker = {index:'Enzo',
title:'Enzo sp. z o.o.',
description:'ul. Kunickiego 46/4 \n 20-417 Lublin \n tel. (081) 531 86 73',
markerColor:0x990099,
strokeColor:0xFFFF00};
latLonController.addMarkerByLatLon("CustomPOIMarker",
Number(51.2294091060463),
Number(22.5725913047791),
myMarker);
}

private function onMapError(errorCode:String,
httpStatus:String):void {
Alert.show(errorCode + '\n' + httpStatus, 'Load Error');
}
]]>
</mx:Script>
<mx:VBox
horizontalAlign="center" horizontalCenter="0"
verticalCenter="0">

<yahoo:YahooMapService id="myAS2Map"
UUID="{UNIQUEID}"
swfDomId="{SWFDOMID}"
apiId="{YAHOOAPIKEY}"
mapURL="{MAPSWF}"/>
</mx:VBox>
</mx:Application>