輸入地址畫出Gmap地圖的做法

輸入地址就可以顯示地圖,超方便的Gmap顯示資料,都是使用應標的方式,但是我們可能可以查的到地址,不見得查的到座標,如果可以直接給地址,就可以顯示地圖出來,一定非常的方便,我想很多人需要這個功能,但是Google官方提供的範例,都是輸入地址後查詢,才顯示地圖。第一動要先預設一個座標,再去查詢地址後,回傳座標之後,再重畫顯示地圖,方法不自動,要人工處理,我查了好久,總算是查到資料,感謝提供網頁,我有空再來測試。

var coder = new GClientGeocoder();
coder.getLatLng(
“江揚”,
function(point) {
if (point) {
var map = new GMap2(document.getElementById(“map_canvas”));
map.addControl(new GLargeMapControl());
map.addControl(new GMapTypeControl());
map.enableScrollWheelZoom();

var information = [
new GLatLng(point.y,point.x)
] ;

function createMarker(data, html) {
var marker = new GMarker(new GLatLng(data.y, data.x));
var html = “1524 Addison Road” +
‘<img src=”op7.png” onClick=”zoomit(‘ + data.y + ‘,’ + data.x + ‘);”>Zoom</a>’;
GEvent.addListener(marker, ‘click’, function() {
marker.openInfoWindowHtml(html);
});
return marker;
}

function zoomit(lat, lng) {
map.setCenter(new GLatLng(lat, lng), 13);
}

for (var i = 0; i < information.length; i++){

var marker = createMarker(information[i]);
map.addOverlay(marker);
marker.show();
}

//calculating center
var latlngbounds = new GLatLngBounds();
for ( var i = 0; i < information.length; i++ ) {
latlngbounds.extend( information[ i ]);
}

//centering the map
map.setCenter(latlngbounds.getCenter(), 13);

}
}
);

WordPress中的外掛MapPress就有這樣的功能,而且還可以使用街景功能,是超級的方便,一定有方法可以達成這樣的功能。所以,查一下,就會有資料囉!
資料來源:在這裡
Google 官方提供的Gmap API範例,也是可以參考一下,在這裡

隨機文章

隨機美圖

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *