Dynamically Resize Yahoo! Map in Flex 2.0 Application

Sunday, November 25th, 2007

The topic around dynamically resizing Yahoo! Maps in Flex came up in the Yahoo! Flash Developer Group last week. At the same time, I had also been trying to solve this problem for a project I’m working on. At first this problem seemed quite mysterious. I could resize the map, but it was always resizing to a 3×2 aspect ratio. If I had a container was not 3×2, the map would pin itself to the top of the container and have white borders to the right and bottom. I tried all possible combinations of properties (height, width, percentHeight, percentWidth, scaleContent) with no luck.

Yahoo! provides an AS3 API for Flex 2.0 developers that includes a SWF (built in AS2.0) and a SWC. The AS3 AstraWebAPI libraries are a set of wrapper tools that facilitate access to Yahoo!’s Web APIs from Flex 2.0 and Flash. This library works quite well, but it only exposes a subset of the API calls that are allowed by the Yahoo! API’s - so as a Flex developer you only have access to the most common calls. Unfortunately the AstraWebAPI swc does not include the setMapSize method that is defined in the as2map.swf file. So how do we access this method?

A little background. as2map.swf is an ActionScript 2 swf that you load into your Flex application when you instantiate a Yahoo Map. The AstraWebAPIs.swc file then provides a set of wrapper classes that uses ExternalInterface to communicate between your Flex application and the as2map.swf. It sounds kind of ugly - and is - but until Yahoo! releases an AS3 version of their mapping tool, this method will have to do.

So how do we make API calls to methods not exposed by AstraWebAPIs.swc file? My solution is to call the ExternalInterfaceBuffer directly from within your Flex application. It’s pretty easy to do…


import com.yahoo.webapis.maps.utils.ExternalInterfaceBuffer;


private function resizeMap(someWidth:int, someHeight:int) : void {
   // SWFDOMID and UNIQUEID are constants set in your existing map code
   var apiCall:String = SWFDOMID + ".setMapSize" + UNIQUEID;
   var EIBuffer:ExternalInterfaceBuffer = ExternalInterfaceBuffer.getInstance();
   EIBuffer.addCall({method:apiCall, data:{w:someWidth, h:someHeight})
}

I have provided an example (with source available here) that you can look at.

One Map API to Rule them All

Thursday, December 21st, 2006

Mapstraction is a javascript library that hides differences between mapping APIs. It provides a common set of JavaScipt functions that lets you switch seamlessly between Google, Yahoo! and Microsoft’s javascript mapping APIs.

Vectored Flash Overlays for Google Maps

Monday, July 10th, 2006

Vectored Flash Overlays for Google Maps (VGMap) is a new library that extends the GMap API and allows designers and developers to overlay data on top of Google Maps in a richer way than is possible using their standard system. The vector graphics are handled by Flash and there is also a facility for introducing animation onto your map.

Interesting Mapping Mashup

Friday, June 2nd, 2006

Pin in the map is an interesting yet simple mashup that allows you to annotate a position on a map then send a link to that point to your friends. For example, if you went to a great restaurant, you could locate it on the map, add a description, then send the resulting page to your friends and family.

Geo-Names Webservice

Friday, March 10th, 2006

Geo-Names provides free geo-data such as geographical names and postal codes. The database contains over 6 million entries for geographical names and the whereof 2.2 million cities and villages worldwide. The service can be accessed through an webservice API or you can download and use their data to host on your own database server.

GeoRSS Google Maps API Extention

Monday, February 13th, 2006

The GeoRSS Google Maps API Extention is a simple way to  create  a Google Map using the GeoRSS extension to the RSS standard.  The API extension is simply a small JavaScript library and is very easy to implement.

Google Earth for Mac

Tuesday, January 10th, 2006

Not to be outdone by Steve Jobs’ series of awesome Apple/Mac announcements this morning, Google announced that Google Earth for Mac is now available for the Macintosh platform.

PHP Mapping Class for Google Maps

Sunday, November 27th, 2005

Looking to include geo mapping capabilities to your PHP applications? Phoogle Maps is a complete mapping class for Google Maps that allows you to place maps on your page with about 5 lines of code!

Yahoo! Maps and Geo-Coding

Friday, November 4th, 2005

I checked out Yahoo! Maps and overall I was very impressed. Although at times the service was slow (but hey, it is just an early beta), the widget that allows you to see your location in a larger context I found extremely usefull for navigation.

The nicest feature though, is the fact that Yahoo! has opened up an API for GeoCoding that uses a simple REST based protocol. If you would like to try the API from PHP, a great example is available at Rasmus’ Toys Page.