如何使用jQuery将可拖动标记添加到Google Map

时间:2010-12-01 08:54:11

标签: jquery google-maps google-maps-api-3

我正在玩谷歌地图,我需要一些指示: - )

我想要一张带有可拖动标记的地图。如果用户拖动标记,则需要使用标记的坐标更新某些表单域。

是否有jQuery插件可以使用Google Maps API的v3执行此操作?

1 个答案:

答案 0 :(得分:29)

你不需要jquery,它不会让它变得更容易。

首先创建地图并添加可拖动标记。

var myLatlng = new google.maps.LatLng(-25.363882,131.044922);
var marker = new google.maps.Marker({
    position: myLatlng, 
    map: map, // handle of the map 
    draggable:true
});

然后你只需要向地图添加一个事件监听器来监听标记拖动事件并更新文本框。

google.maps.event.addListener(
    marker,
    'drag',
    function() {
        document.getElementById('lat').value = marker.position.lat();
        document.getElementById('lng').value = marker.position.lng();
    }
);

http://jsfiddle.net/xTh5U/