FlexでGoogleMapsを表示してみる

Flexで地図を表示するためのライブラリModest Mapsを使って、試しにGoogleMapsのタイルを読み込んでみました。
Modest Mapsのソース及びSWCはこちらでダウンロードできます。
https://github.com/migurski/modestmaps-as3

※GoogleMapsのタイル画像に直接アクセスするのは規約違反になりますので、本サンプルを実際のプロジェクトで使うのはやめておきましょう。

1)ModestMapsを使ってOpenStreetMapを表示するサンプルがADCに公開されています。
http://www.adobe.com/devnet/flex/articles/interactive_maps.html
http://www.flexmappers.com/mymodestmap/
非常に分かりやすいサンプルなので、今回はこれをダウンロードしてきて地図タイルをGoogleに切り替えてみます。

2)以下のように、GoogleMapsのタイルを取得するためのクラスを作ります。

GoogleMapsProvider.as

package com.modestmaps.mapproviders
{ 
	import com.modestmaps.core.Coordinate;
	
	public class GoogleMapsProvider
		extends AbstractMapProvider
		implements IMapProvider
	{
	    public function GoogleMapsProvider(minZoom:int=MIN_ZOOM, maxZoom:int=MAX_ZOOM)
        {
            super(minZoom, maxZoom);
        }

	    public function toString() : String
	    {
	        return "GOOGLE_MAPS";
	    }
	
	    public function getTileUrls(coord:Coordinate):Array
	    {
	        var sourceCoord:Coordinate = sourceCoordinate(coord);
			return [ 'http://mt0.google.com/vt/lyrs=m@127&x='+(sourceCoord.column)+'&y='+(sourceCoord.row)+'&z='+(sourceCoord.zoom) ];
	    }
	    
	}
}

3)メイン画面にて、OpenStreetMapProviderを使っている箇所を先程のGoogleMapsProviderに差し替えます。

main.mxml

_map = new TweenMap(mappanel.width, mappanel.height, true, new GoogleMapsProvider());

たったこれだけでFlash上でGoogleMapsを表示できました。