2008年2月17日日曜日

住所から緯度経度を取得して地図にマーキング(Google Maps API)

スズキです。

下記は、表記を複数住所(配列)で実現するためのコードです。

ポイントは戻り値に関数を返しているmarkPointの部分です。
つまり以前にもふれた、クロージャのお話です。(多分...)
http://suz-lab.blogspot.com/2008/02/google-maps.html

markPointに引数(住所)を持つことで、
吹き出しに該当住所を表示できるようにもしています。

--------
var map;
var geocoder;

$(function(){
  if (GBrowserIsCompatible()) {
    map = new GMap2(document.getElementById("map"));
    map.setCenter(new GLatLng(36.04465753921525, 139.24072265625), 7);
    geocoder = new GClientGeocoder();
    var addresses = ["東京都", "神奈川県", "埼玉県"];
      for(var i = 0; i < addresses.length; i++) {
        geocoder.getLatLng(addresses[i], markPoint(addresses[i]));
      }
  }
});

function markPoint(address) {
  return function(point){
    var marker = new GMarker(point)
      GEvent.addListener(marker, "click", function() {
        map.openInfoWindowHtml(point, address);
    });
    map.addOverlay(marker);
  };
}
--------

改善したい点は、
○グローバル変数 - どうするのが美しいが考察しきれていない
○GMarkerManager - 挑戦したけど、なぜかマーキングされない
のあたりでしょうか?

とりあえず、クロージャーの理解が深まったような気がする。
(でも、勘違いしてる可能性あり!?)

--

http://suz-lab.blogspot.com/

0 コメント: