線上書籍

一、輸入地址找位置

1.GClientGeocoder()是Gmap的地理編碼服務，請在function initialize() 中加入；

geocoder = new GClientGeocoder();

2.在function initialize() 下方加入用來搜尋的函數showAddress()：

function showAddress(address) {
  geocoder.getLatLng(
    address,
    function(point) {
      if (!point) {
        alert("找不到：" + address);
      } else {
        map.setCenter(point, 13);
        var marker = new GMarker(point, {draggable: true ,bouncy:true});
        map.addOverlay(marker);
        marker.openInfoWindowHtml(address);
      }
    }
  );
}

3.因為 initialize() 和 showAddress() 都會用到 map 及 geocoder，所以，在 initialize() 前先宣告這兩個變數

var map =null;
var geocoder =null;

4.設定輸入地址的文字框：

<form action="#" onsubmit="showAddress(this.address.value); return false">
  <input type="text" size="60" name="address" value="" />
  <input type="submit" value="查詢" />
</form>

二、存入地址、經緯度

1.利用document.getElementById("欄位名").value 將值給塞進去表單中。
2.此外，找到的位置有時後會有誤差，因此，建立一個監聽事件，紀錄調整後之位置。

document.getElementById("latlng").value = markerLatLng.toString();
document.getElementById("name").value = address;

//移動節點後要進行的動作
GEvent.addListener(marker, "dragend", function() {
  markerLatLng = marker.getLatLng();
  document.getElementById("latlng").value = markerLatLng.toString();
});

三、讀出已存位置

1.利用 showAddress('{$latlng}') 來導到我們要的精確位置。

function list_map(){
  $sql="select `latlng`,`name` from `gmap`";
  $result=mysql_query($sql) or die($sql);
  $main="<ol>";
  while(list($latlng,$name)=mysql_fetch_row($result)){
    $main.="<li><a onClick=\"showAddress('{$latlng}');\">$name</a></li>";
  }
  $main.="</ol>";
  eturn $main;
}