Javascript 可拖动pin不更新Google Maps API中的坐标

我有这个代码，允许用户通过点击地图在谷歌地图中插入PIN。现在我正在尝试使这个pin可拖动，所以我只是在标记的初始化中添加了

draggable:true，

。但这并不是用坐标更新字段。只有当用户在另一个地方单击时，它才起作用。我错过了什么

  // global "map" variable
    var map = null;
    var marker = null;

    // popup window for pin, if in use
    var infowindow = new google.maps.InfoWindow({ 
        size: new google.maps.Size(150,50)
        });

    // A function to create the marker and set up the event window function 
    function createMarker(latlng, name, html) {

    var contentString = html;

    var marker = new google.maps.Marker({
        position: latlng,
        map: map,
        zIndex: Math.round(latlng.lat()*-100000)<<5
        });

    google.maps.event.addListener(marker, 'click', function() {
        infowindow.setContent(contentString); 
        infowindow.open(map,marker);
        });

    google.maps.event.trigger(marker, 'click');    
    return marker;


}

function initialize() {

    // the location of the initial pin
    var myLatlng = new google.maps.LatLng(-19.919131, -43.938637);

    // create the map
    var myOptions = {
        zoom: 15,
        center: myLatlng,
        mapTypeControl: true,
        mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU},
        navigationControl: true,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    }


    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

    // establish the initial marker/pin


    var marker = new google.maps.Marker({
      position: myLatlng,
      map: map,
      title:"Property Location", 
    draggable:true,
    icon: {
        url: 'https://4.bp.blogspot.com/-nHydF9OdHLw/V8OxZbpJW6I/AAAAAAAAADM/G_QLEm7aScUOc3XwZmc5X8DmMHp7FK3RwCLcB/s1600/BikeSpot-Pin-Logo.png',

        // base image is 60x60 px
        size: new google.maps.Size(64, 96),

        // we want to render @ 30x30 logical px (@2x dppx or 'Retina')
        scaledSize: new google.maps.Size(32, 48), 
       // the most top-left point of your marker in the sprite
        // (based on scaledSize, not original)
        origin: new google.maps.Point(0, 0),

        // the "pointer"/anchor coordinates of the marker (again based on scaledSize)
        anchor: new google.maps.Point(16, 48)
    }
});

    // establish the initial div form fields
   formlat = myLatlng.lat();
    formlng = myLatlng.lng();
    document.getElementById("LatLng-Input").value = myLatlng.toUrlValue();

    // close popup window
    google.maps.event.addListener(map, 'click', function() {
        infowindow.close();
        });

    // removing old markers/pins
    google.maps.event.addListener(map, 'click', function(event) {
        //call function to create marker
         if (marker) {
            marker.setMap(null);
            marker = null;
         }

        // Information for popup window if you so chose to have one
        /*
         marker = createMarker(event.latLng, "name", "<b>Location</b><br>"+event.latLng);
        */

        var image = 'https://4.bp.blogspot.com/-nHydF9OdHLw/V8OxZbpJW6I/AAAAAAAAADM/G_QLEm7aScUOc3XwZmc5X8DmMHp7FK3RwCLcB/s1600/BikeSpot-Pin-Logo.png';
        var myLatLng = event.latLng ;
        /*  
        var marker = new google.maps.Marker({
            by removing the 'var' subsquent pin placement removes the old pin icon
        */
        marker = new google.maps.Marker({   
            position: myLatLng,  
            map: map,
            icon: image,
            title:"Bicicletario",

    icon: {
        url: 'https://4.bp.blogspot.com/-nHydF9OdHLw/V8OxZbpJW6I/AAAAAAAAADM/G_QLEm7aScUOc3XwZmc5X8DmMHp7FK3RwCLcB/s1600/BikeSpot-Pin-Logo.png',

        // base image is 60x60 px
        size: new google.maps.Size(64, 96),

        // we want to render @ 30x30 logical px (@2x dppx or 'Retina')
        scaledSize: new google.maps.Size(32, 48), 

       // the most top-left point of your marker in the sprite
        // (based on scaledSize, not original)
        origin: new google.maps.Point(0, 0),

        // the "pointer"/anchor coordinates of the marker (again based on scaledSize)
        anchor: new google.maps.Point(16, 48)

    }


        });

        // populate the form fields with lat & lng 
  formlat = event.latLng.lat();
   formlng = event.latLng.lng();
   document.getElementById("LatLng-Input").value  = formlat +", "+formlng

});
}


    });

}

//全局“map”变量
var-map=null；
var-marker=null；
//pin的弹出窗口（如果正在使用）
var infowindow=new google.maps.infowindow（{
尺寸：新谷歌地图尺寸（150,50）
});
//创建标记和设置事件窗口功能的函数
函数createMarker（latlng、name、html）{
var contentString=html；
var marker=new google.maps.marker({
位置：latlng，
地图：地图，
zIndex:Math.round（latlng.lat（）*-100000）它不会更新坐标，因为您没有告诉它这样做。您必须添加一个dragend处理程序并更新您的元素，在拖动标记完成后显示坐标：

marker.addListener('dragend', function(event){
    document.getElementById("LatLng-Input").value = event.latLng.lat() + ", " + event.latLng.lng();
});

如果要使用infowindow，则必须更新infowindow的内容：

marker.addListener('dragend', function(event){
    infoWindow.setContent(event.latLng.lat() + ", " + event.latLng.lng());
});

如果您希望在拖动时也更新坐标，请添加另一个具有
'drag'
的处理程序，而不是
'dragend'
它不会更新坐标，因为您没有告诉它更新坐标。您必须添加dragend处理程序并更新您的元素，当拖动标记已完成：

marker.addListener('dragend', function(event){
    document.getElementById("LatLng-Input").value = event.latLng.lat() + ", " + event.latLng.lng();
});

如果要使用infowindow，则必须更新infowindow的内容：

marker.addListener('dragend', function(event){
    infoWindow.setContent(event.latLng.lat() + ", " + event.latLng.lng());
});

如果您想在拖动时更新坐标，请添加另一个带有
'drag'
的处理程序，而不是
'dragend'
您可以在此处添加您的html吗？当然！我已经编辑了问题您可以在您的开发工具中添加可拖动的html元素吗？您可以在此处添加您的html吗？当然！我已经编辑了问题您可以添加可拖动的html吗e作为开发中的html元素？非常好。非常感谢。非常好。非常感谢。