ジオコーディングオブジェクト - 新米CSharperの他言語日記

今までは位置情報をリクエストを投げる事で得ていたが、毎回そんなことしてられないよね。

そんなわけでジオコーディングオブジェクトを使います。詳細はGoogleCodeのココ！

ではでは、今回は

住所を入力したら、
その住所にマーカーを打って、
吹き出しに住所を出して
緯度と経度をテキストボックスに出してやる

ことにします。

まずはグーグルのサイトのサンプルコードを見てみましょ。

var map = new GMap2(document.getElementById("map_canvas"));
var geocoder = new GClientGeocoder();
function showAddress(address){
    geocoder.getLatLng(address, function(point){
         if (!point) {
             alert(address + " not found");
         }
        else {
             map.setCenter(point, 13);
             var marker = new GMarker(point);
             map.addOverlay(marker);
             marker.openInfoWindowHtml(address);
        }
    });
}

解説を見ると、

GClientGeocoder#getLatLngは住所と住所の取得時に実行されるコールバック関数を引数にとる

と書いてある。
なるほど、まあコールバック関数は、csでいうとこのデリゲートみたいなもんだな。
コールバック関数にはGLatLngオブジェクト、つまり位置情報のオブジェクトが返されると書いてある。
確かにコールバック関数内ではpointって引数をGMarkerに入れたりしてるからGLatLngオブジェクトのようだ。
ってことは、GLatLng#lat()やlng()で緯度、経度も取得できるはずだ。

ふむふむ、ここまで情報が揃えば、ルルーシュ風に言えば

『条件はすべてクリアされた』

だな。

さて、では関数を作ってみる。と言ってもほぼパクリだけど。

/**
 * 住所情報を表示する。実際は緯度経度出したりいろいろしてる。。
 * @param {Object} address 住所
 */
function showAddress(address){
    var map = new GMap2(document.getElementById("map"));
    var geocoder = new GClientGeocoder();
    geocoder.getLatLng(address, function(point){
        if (!point) {
            alert(address + " not found");
        } else {
            map.setCenter(point, 17);
            var marker = new GMarker(point);
            map.addOverlay(marker);
            marker.openInfoWindowHtml(address);
            document.getElementById("txtResultLat").value = point.lat();
            document.getElementById("txtResultLng").value = point.lng();
        }
    });
}
/**
 * テキストボックスの住所から住所情報を表示します。
 * @param {Object} addressHolderId 住所を格納したなんかのID
 */            
function showAddressByTextBox(addressHolderId){
    var address = document.getElementById(addressHolderId).value;
    showAddress(address);
}

なんかしてると言えば、テキストボックスから住所取ったり、緯度経度入れたりしてるだけ。
いちおう、起動ボタンとかも書くと

<input type="button" onclick="showAddressByTextBox('txtAddressInput');" value="Get 緯度経度" />

後は定義したIDをもったテキストボックスを配置してやるだけ。

サンプルはコチラ！

ジオコーディングオブジェクトは他にもJSON形式で取ったり、キャッシュ機能があったりするみたい。暇があったら触ってみる…つもり。

よし、明日は代休だ！違う今日だった！