描画マネージャーマーカーリスナーPosition_Changed

Question

私のコードに問題があります。描画マネージャを使用してマーカーを描画した後にドラッグ可能なマーカーを作成したいと考えて、ドラッグ可能なマーカー位置の値で入力フィールドの値[lat & lon]を変更したいと考えています。これは私のコードです：

function initMap() { 
     // set up the map 
     mapModal = new google.maps.Map(document.getElementById('mapModal'), { 
      center : {lat: lat, lng: lng}, 
      zoom : 15, 
      mapTypeId: google.maps.MapTypeId.ROADMAP, 
      disableDefaultUI: false, 
      zoomControl : true, 
     }); 

     var drawingManager = new google.maps.drawing.DrawingManager({ 
      drawingMode: google.maps.drawing.OverlayType.MARKER, 
      drawingControl: true, 
      drawingControlOptions: { 
       position: google.maps.ControlPosition.TOP_CENTER, 
       drawingModes: ['marker'] 
      }, 
      markerOptions: { 
       editable: true, 
       draggable: true, 
      }, 
     }); 
     drawingManager.setMap(mapModal); 
     google.maps.event.addListener(drawingManager, 'overlaycomplete', function(marker) { 
      google.maps.event.addListener(marker, 'position_changed', function() { 
       var lat = marker.getPosition().lat(); 
       var lon = marker.getPosition().lng(); 

       $('#lat').val(lat); 
       $('#lon').val(lon); 
      }); 
     }); 
    } 

私は、入力フィールド[lat & lon]の値が変更された取得することはありません。誰も私の問題を解決するために私を助けることができますか？ありがとう！

Answer 1

主な問題は、marker.getPosition（）。lat（）;だと思います。イベントハンドラの中では、 "マーカー"の代わりに "this"を使うべきです。それがすべてを解決するかどうかは分かりません。ここで

は

<input id="lat" /> 
<input id="lng" /> 
<div id="map"></div> 
<style> 
    #map { 
     height: 400px; 
    } 
</style> 
<script> 
    function initMap() { 
     var myLatlng = { // Brussels 
      lat: 50.85, 
      lng: 4.35 
     }; 

     var map = new google.maps.Map(document.getElementById('map'), { 
      zoom: 12, 
      center: myLatlng 
     }); 

     var marker = new google.maps.Marker({ 
      position: myLatlng, 
      map: map, 
      draggable: true, 
      title: 'Drag me' 
     }); 

     google.maps.event.addListener(marker, 'position_changed', function() { 
      // inside an event handler you should use "this". 
      // "this" represents whatever got affected, in this case the marker 
      document.getElementById('lat').value = this.getPosition().lat(); 
      document.getElementById('lng').value = this.getPosition().lng(); 
     }); 

    } 
</script> 
<script src="https://maps.googleapis.com/maps/api/js?callback=initMap"></script>