リバースジオコーディング

getLocationsメソッドは1番目の引数に住所などの文字列を指定すると、それに一致する地点の候補の情報を返しますが、引数に座標を表すGLatLngクラスのオブジェクトを指定すると、その座標に一致する地点の情報を返します。

返された情報の中から住所に関する値を取り出すことで座標から住所を取得するリバースジオコーディングを行うことが可能です。

実際には次のように記述します。

var map = new GMap2(document.getElementById("map"));
map.setCenter(new GLatLng(35.658517, 139.745493), 15);

var geocoder = new GClientGeocoder();
var latlng = new GLatLng(35.658517, 139.745493);
geocoder.getLocations(latlng, markAddress);

function markAddress(obj){
  if (obj.Status.code == G_GEO_SUCCESS){
    /* ... */
  }else{
    alert("データの取得に失敗しました");
  }
}

前のページで確認したとおり、コールバック関数で呼び出される関数に渡されてくるオブジェクトの中でPlacemarkプロパティの中のaddrssプロパティの値が一致した住所に該当しますのでこの値を取り出すようにして下さい。

サンプルプログラム

では試してみます。

code3_1.js

var map;
var geocoder;

function initialize() {
  if (GBrowserIsCompatible()) {
    map = new GMap2(document.getElementById("map_canvas"));
    map.setCenter(new GLatLng(35.169564,136.882782), 16);

    geocoder = new GClientGeocoder();
    GEvent.addListener(map, "click", clickMap);
  }
}

function clickMap(overlay, latlng){
  geocoder.getLocations(latlng, dispResult);
}

function dispResult(addresses){
  if (addresses.Status.code == G_GEO_SUCCESS){
    var place = addresses.Placemark[0];
    document.getElementById("address").value = place.address;
  }else{
    alert("データを取得できませんでした");
  }
}

map3_1.html

<!DOCTYPE html "-//W3C//DTD XHTML 1.0 Strict//EN" 
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
    <title>サンプル：リバースジオコーディング</title>
    <script src="http://maps.google.com/maps?file=api&v=2&key=(key)&sensor=false"
            type="text/javascript" charset="utf-8"></script>
    <script src="./js/code3_1.js" type="text/javascript"></script>
  </head>
  <body onload="initialize()" onunload="GUnload()">
    <div id="map_canvas" style="width: 400px; height: 400px"></div>

    <form>
    <p>
    地名：<input type="text" id="address" size="50" value="" />
    </p>
    </form>

  </body>
</html>

ではブラウザで上記のURLを見てみます。

p3-1

地図上の地点をクリックすると、その位置の座標を取得した上でリバースジオコーディングを行ってその地点の住所情報を地図下のテキストボックスに表示します。今回は複数の候補の中から最初の候補のaddressプロパティの値を取得しています。

p3-2

赤い丸の中の箇所をクリックしたところ、住所を取得することができました。

ただ常に住所が帰ってくるわけではなく、クリックする場所によっては道路に関する情報が表示されたり郵便番号だけが表示される場合があります。

p3-3

p3-4

道路名を返してきた場合でも取得した情報の中の他の候補を見てみれば住所が入っている場合もあります。AddressDetails.Accuracyプロパティの値を見て、より精度の高い候補のaddressプロパティの値を取り出すようにすればよりいいかもしれません。

( Written by Tatsuo Ikura )

Profile

著者 / TATSUO IKURA

プログラミングや開発環境構築の解説サイトを運営しています。