API Карт Google Получить координаты только при размещении первого маркера

Question

Я создаю карту с API Карт Google, и для этого вы можете разместить только 1 маркер и затем перетащить его по карте. Мне нужно получить координаты маркера в каждом месте, когда он помещается в первый раз, а также каждый раз перетаскивается.

I've просматривал много ответов, и провел много часов с этим, но на самом деле это не распространяется решить эту проблему, вот мой код:

<!-- Google Maps API --> 
<div id="map-canvas"></div> 
<script type="text/javascript"> 
function loadmap() { 
    // initialize map 
    var marker; 
    var map = new google.maps.Map(document.getElementById("map-canvas"), { 
     center: new google.maps.LatLng(20, -40), 
     zoom: 1, 
     mapTypeId: google.maps.MapTypeId.SATELLITE, 
     streetViewControl: false 
    }); 
    // This event listener will call addMarker() when the map is clicked. 
    map.addListener('click', function(event) { 
     placeMarker(event.latLng); 
     document.getElementById('displayLat').value = event.latLng.lat(); 
     document.getElementById('displayLong').value = event.latLng.lng(); 
    }); 
    map.addListener(marker,'dragend', function(event) { 
     document.getElementById('displayLat').value = event.latLng.lat(); 
     document.getElementById('displayLong').value = event.latLng.lng(); 
    }); 
    // Adds a marker to the map. 
    function placeMarker(location) { 
     if (marker) { 
     }else{ 
     marker = new google.maps.Marker({ 
      draggable: true,     
      position: location, 
      map: map 
     }); 
     } 
    } 
} 
</script> 

скрипты работают на полпути только I получать координаты каждый раз, когда я нажимаю карту (либо если маркер уже установлен), и я не получаю координаты, когда я перетаскиваю маркер.

Я новичок в Javascript, и, исходя из моего понимания, я должен разместить какое-то условие «если» внутри слушателя, поэтому, если маркер уже размещен, чтобы не дать координаты действия «щелчка», но я не знаю, как подойти.

Заранее благодарен,

Answer 1

Две проблемы с кодом. Во-первых, решение вашей проблемы. У вас есть

map.addListener(marker,'dragend', function(event) { 

, но функция addListener принимает только 2 параметра, тип события и функцию обратного вызова. И вы добавляете этого слушателя к карте, а не к маркеру. Измените его следующим образом:

marker.addListener('dragend', function(event) { 

Во-вторых, у вас есть слушатель событий для того, когда пользователь нажимает на карту, и каждый раз, вы проверяете, если они создали маркер уже или нет, так вы только когда-либо создадите его один раз. Все в порядке, в коде нет ничего плохого. Однако есть намного лучший способ сделать это.

Вы можете использовать функцию google.maps.event.addListenerOnce, которая выполняется только один раз. Таким образом, с помощью этого вы можете упростить ваш код немного:

function loadmap() { 
    var marker; 
    var map = new google.maps.Map(document.getElementById("map-canvas"), { 
     center: new google.maps.LatLng(20, -40), 
     zoom: 1, 
     mapTypeId: google.maps.MapTypeId.SATELLITE, 
     streetViewControl: false 
    }); 

    google.maps.event.addListenerOnce(map, 'click', function(event) { 
     marker = new google.maps.Marker({ 
      draggable: true,     
      position: event.latLng, 
      map: map 
     }); 

     marker.addListener('dragend', function(event) { 
      document.getElementById('displayLat').value = event.latLng.lat(); 
      document.getElementById('displayLong').value = event.latLng.lng(); 
     }); 
    }); 
} 

Я также хочу только добавить слушатель событий маркеров после создания маркеров.