GoogleMapsを使ってみる13

GoogleMapsバージョンも公開されたShortest Path Graphicだが、どうやら次は入力部分もGoogleMapsに対応する予定のようだ。


入力にもGoogleMapsを使う意味や利点は以下の通り。
１，結果もGoogleMapsなのだから当たり前。
２，マーカーのドラッグ機能などを駆使できる。
３，拡大縮小が自由にできるため細かい値を指定しやすい。


問題点は以下の通り。

１，クリックされた場所が地図にある保証がない（現時点であるのは全米のみ）
２，すべての計算が全米になってしまうので負荷がかかる。


１はユーザーが正しいものを入力してくれると信じれば特に気にする必要はないため、実装は後にする方針。緯度経度の取得はできるので最低限なんとかなるだろうということもあり楽観視しているという噂もある。

２はとりあえず見ないことにする。P2Pバージョンに限定するなどの処置を取ることも場合によっては視野に入れる必要があるかもしれない。


利点の２について少し説明する。
基本的に今まで用いてきた技術を変えていけば作成可能になるが、ドラッグイベントの処理は少々面倒なので今まで使っていたのとは違い以下のようにしてみる。

  var newMarker = new GMarker(point, {draggable: true}); 

でドラッグできるマーカーが作成できる。

var map;
var marker_num=0;
var marker1=null;
var marker2=null;
var tmp_marker=null;
var marker1_tmp = null;

function eventMarker(point){
  map.closeInfoWindow();
  var newMarker = new GMarker(point, {draggable: true});
  if(marker_num % 2 == 1){
    tmp_marker = marker2;
    marker2 = newMarker;
  }
  else{
    tmp_marker = marker1;
    marker1 = newMarker;
  }
  GEvent.addListener(newMarker, "dragstart", function() {
      map.closeInfoWindowHtml();
  });

  GEvent.addListener(newMarker, "dragend", function() {
       var currentPoint = newMarker.getPoint();
       newMarker.openInfoWindowHtml("latitude: " + (currentPoint.lat()) + "
longitude: " + (currentPoint.lng()));
  });

  GEvent.addListener(newMarker, "click", function() {
       var currentPoint = newMarker.getPoint();
       newMarker.openInfoWindowHtml("latitude: " + (currentPoint.lat()) + "
longitude: " + (currentPoint.lng()));
  });
  map.addOverlay(newMarker);
  if(tmp_marker!=null)map.removeOverlay(tmp_marker);
  marker_num++;
}

また、load()関数の中で

    GEvent.addListener(map, "click", function(overlay, point){
  if(point){
    eventMarker(point);
  }
    });

しておけばよい。marker1とmarker2を使い、3つめのマーカーが作られたときに古い方のマーカーを消す作業を入れている。これは既存のShortest Path Graphicと同じような仕様だ。

参考：http://www.tatamilab.jp/~ooi1/GoogleSample5.html