Check

google map apiで住所を示す感じにする

| | コメント(0) | トラックバック(0)

結局こんな感じに組み替え。

$(document).ready( function(){
if ( !GBrowserIsCompatible() ) {
return false;
}
var conf_val = init();
var map = new GMap2( $('#map')[0] );
var point = new GLatLng( conf_val['l'], conf_val['r'] );
var icon = new GIcon();
icon.image = 'http://www.google.com/intl/en_ALL/mapfiles/arrow.png';
icon.shadow =
'http://www.google.com/intl/en_ALL/mapfiles/arrowshadow.png';
icon.iconSize = new GSize(39, 34);
icon.shadowSize = new GSize(39, 34);
icon.iconAnchor = new GPoint( 12, 34 );
icon.infoWindowAnchor = new GPoint( 12, 3 );
var marker = new GMarker( point, icon );
map.setCenter( point, 16 );
map.addControl( new GLargeMapControl() );
map.addOverlay( marker );

GEvent.addListener( marker, 'click', function() {
marker.openInfoWindowHtml(
conf_val['message']
);
$('.gmapWindow').get(0).parentNode.style.paddingTop = '10px';
} );
} );
$(document).unload( function(){ GUnload() } );

呼び出し側は「script src="hoge.js"」で読み込んだ後、こんな感じで値を設定。

function init() {
return {
'l' : 37.4419,
'r' : -122.1419,
'message' : 'hogehoge'
};
}

住所から座標の変換は以下のサービスから行う。

http://www.geocoding.jp/

前回のものでは「iconAnchor」がおかしかったので拡大率によって座標がずれてたけど、以下のページで紹介されてる方法で正しいGSizeを設定したらうまく行くようになった。

http://ecogis.sfc.keio.ac.jp/developers/gmaps/tut_3_1.html

トラックバック(0)

このブログ記事を参照しているブログ一覧: google map apiで住所を示す感じにする

このブログ記事に対するトラックバックURL: http://0-9.sakura.ne.jp/mt/mt-tb.cgi/112

コメントする