GoogleMapで、現在表示中のマップの中心緯度・経度を取得する為のカスタムコントロール
適当にGoogleMapのサンプルとかAPIドキュメント見ながらでっち上げたやつです。GoogleAJAX API経由でロードする方式に併せてます。あと、コードピースですので、実際に組み込む時は自己責任の上で、適宜足りない部分を想像等で補って下さい。
"WhereAmI?"カスタムコントロール
<script type="text/javascript"> <!-- function WhereAmIControl() {} function build_whereami() { WhereAmIControl.prototype = new google.maps.Control(); WhereAmIControl.prototype.initialize = function(map) { var container = document.createElement("div"); var mainDiv = document.createElement("div"); mainDiv.style.textDecoration = "underline"; mainDiv.style.color = "#0000cc"; mainDiv.style.backgroundColor = "white"; mainDiv.style.font = "small Arial"; mainDiv.style.border = "1px solid black"; mainDiv.style.padding = "2px"; mainDiv.style.marginBottom = "3px"; mainDiv.style.textAlign = "center"; mainDiv.style.width = "6em"; mainDiv.style.cursor = "pointer"; container.appendChild(mainDiv); mainDiv.appendChild(document.createTextNode("WhereAmI?")); google.maps.Event.addDomListener(mainDiv, "click", function() { var latlng = map.getCenter(); void(window.prompt('latitude, longitude', latlng.toUrlValue())); }); map.getContainer().appendChild(container); return container; } WhereAmIControl.prototype.getDefaultPosition = function() { return new GControlPosition(G_ANCHOR_BOTTOM_RIGHT, new GSize(7, 20)); } } //--> </script>
以上のJSコードを適当な箇所に挿入し、google.load()で呼び出しておきます。
// 適当にonloadなイベントに組み込んで下さい。 google.load("maps", "2", {"callback" : build_whereami });
GMap2のコントロールに貼り付けるには、普通にaddControlでOKです。右下から20px程上、著作権表示と被らない辺りに"WhereAmI?"リンクボックスが表示されるようにしてます。リンクをクリックすると、地図の中心座標を「緯度, 経度」の順でpromptで表示しますので、そのままコピペしちゃえます。
google.load("maps", "2", {"callback" : function() { if (!google.maps.BrowserIsCompatible()) { return; } var map = new google.maps.Map2(document.getElementById('エレメントのID')); map.setCenter(new google.maps.LatLng(lat, lng), zoom); map.addControl(new WhereAmIControl()); }});
JavaScriptの名前空間とかスコープ、めちゃあやふやな頭で書いてますので、注意して下さい。一応WinXPのFirefox2, IE7, Opera9で確認はしてますが・・・。