google map v3 实现拖动得到坐标和坐标详细地址
最近的项目有要用google map v3 所以,看来多次文档和demo 实现了一些东西,话不多说,上代码,后面附文件
如果你有什么不懂得或者讨论的请加群:150508281
var geocoder = new google.maps.Geocoder();
function geocodePosition(pos) {
geocoder.geocode({
latLng: pos
}, function(responses) {
if (responses && responses.length > 0) {
updateMarkerAddress(responses[0].formatted_address);
} else {
updateMarkerAddress('无法确定地址在这个位置。');
}
});
}
function updateMarkerStatus(str) {
document.getElementById('markerStatus').innerHTML = str;
}
function updateMarkerPosition(latLng) {
document.getElementById('info').innerHTML = [
latLng.lat(),
latLng.lng()
].join(', ');
}
function updateMarkerAddress(str) {
document.getElementById('address').innerHTML = str;
}
function initialize() {
var latLng = new google.maps.LatLng(31.1933370274183, 121.43890661621094);
var map = new google.maps.Map(document.getElementById('mapCanvas'), {
zoom: 11,
center: latLng,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var marker = new google.maps.Marker({
position: latLng,
title: 'Point A',
icon:"pred.gif",
map: map,
draggable: true
});
google.maps.event.addListener(marker, "mouseover", function() {
marker.setImage('pred.gif');
});
google.maps.event.addListener(marker, "mouseout", function() {
marker.setImage('pgreen.gif');
});
// 更新当前的位置信息
updateMarkerPosition(latLng);
geocodePosition(latLng);
// 添加拖动事件监听器
google.maps.event.addListener(marker, 'dragstart', function() {
updateMarkerAddress('正在搜索...');
});
google.maps.event.addListener(marker, 'drag', function() {
updateMarkerStatus('正在搜索...');
updateMarkerPosition(marker.getPosition());
});
google.maps.event.addListener(marker, 'dragend', function() {
updateMarkerStatus('搜索结束');
geocodePosition(marker.getPosition());
});
}
// 加载载应用程序。
google.maps.event.addDomListener(window, 'load', initialize);
1 楼
hzfeibao
2012-05-11
关注一下,我最近也要用到谷歌地图