Отримання Lat / Lng від маркера Google

Я створив карту Google Maps із маркером, який можна перетягнути. Коли користувач перетягує маркер, мені потрібно знати нові широту та довготу, але я не розумію, який найкращий підхід до цього.

Як я можу отримати нові координати?

Ось демонстрація JSFiddle . В API Карт Google V3 досить просто відстежувати ширину та довжину маркера, який можна перетягнути. Почнемо з наступних HTML та CSS як основи.

<div id='map_canvas'></div>
<div id="current">Nothing yet...</div>

#map_canvas{
    width: 400px;
    height: 300px;
}

#current{
     padding-top: 25px;
}

Ось наш початковий JavaScript, який ініціалізує карту Google. Ми створюємо маркер, який ми хочемо перетягнути, і встановлюємо його властивість перетягування на true. Звичайно, майте на увазі, що його слід прикріпити до події завантаження вашого вікна, щоб воно завантажилося, але я перейду до коду:

var map = new google.maps.Map(document.getElementById('map_canvas'), {
    zoom: 1,
    center: new google.maps.LatLng(35.137879, -82.836914),
    mapTypeId: google.maps.MapTypeId.ROADMAP
});

var myMarker = new google.maps.Marker({
    position: new google.maps.LatLng(47.651968, 9.478485),
    draggable: true
});

Тут ми додаємо дві події, dragstartщоб відстежувати початок перетягування та dragendтягнути, коли маркер перестає перетягуватися, і спосіб, яким ми його прикріплюємо, використовувати google.maps.event.addListener. Що ми тут робимо, це встановлюємо currentвміст div , коли маркер перетягується, а потім встановлюємо lat та lng маркера, коли перетягування зупиняється. Подія миші Google має назву властивості 'latlng', яка повертає об'єкт 'google.maps.LatLng', коли подія спрацьовує. Отже, те, що ми робимо тут, - це в основному використання ідентифікатора для цього слухача, який повертається методом google.maps.event.addListenerі отримує властивість latLngвитягувати поточну позицію драгенда. Як тільки ми отримаємо цю Lat Lng, коли перетягування припиниться, ми відобразимо у вашому currentdiv:

google.maps.event.addListener(myMarker, 'dragend', function(evt){
    document.getElementById('current').innerHTML = '<p>Marker dropped: Current Lat: ' + evt.latLng.lat().toFixed(3) + ' Current Lng: ' + evt.latLng.lng().toFixed(3) + '</p>';
});

google.maps.event.addListener(myMarker, 'dragstart', function(evt){
    document.getElementById('current').innerHTML = '<p>Currently dragging marker...</p>';
});

Нарешті, ми відцентруємо наш маркер і покажемо його на карті:

map.setCenter(myMarker.position);
myMarker.setMap(map);

Повідомте мене, якщо у вас виникнуть запитання щодо моєї відповіді.

var lat = marker.getPosition().lat();
var lng = marker.getPosition().lng();

Більше інформації можна знайти в API Карт Google - LatLng

Ви можете просто подзвонити getPosition()наMarker - ви пробували це?

Якщо ви перебуваєте на застарілій, v2 з API JavaScript, ви можете зателефонувати getLatLng()наGMarker .

спробуйте це

var latlng = new google.maps.LatLng(51.4975941, -0.0803232);
var map = new google.maps.Map(document.getElementById('map'), {
    center: latlng,
    zoom: 11,
    mapTypeId: google.maps.MapTypeId.ROADMAP
});
var marker = new google.maps.Marker({
    position: latlng,
    map: map,
    title: 'Set lat/lon values for this property',
    draggable: true
});

google.maps.event.addListener(marker, 'dragend', function (event) {
    document.getElementById("latbox").value = this.getPosition().lat();
    document.getElementById("lngbox").value = this.getPosition().lng();
});

// show the marker position //

console.log( objMarker.position.lat() );
console.log( objMarker.position.lng() );

// create a new point based into marker position //

var deltaLat = 1.002;
var deltaLng = -1.003;

var objPoint = new google.maps.LatLng( 
  parseFloat( objMarker.position.lat() ) + deltaLat, 
  parseFloat( objMarker.position.lng() ) + deltaLng
);

// now center the map using the new point //

objMap.setCenter( objPoint );

Вам слід додати слухача на маркер та прослухати подію перетягування або перетягування та запитати подію про її місце, коли ви отримаєте цю подію.

Див. Http://code.google.com/intl/fr/apis/maps/documentation/javascript/reference.html#Marker для опису подій, викликаних маркером. І див. Http://code.google.com/intl/fr/apis/maps/documentation/javascript/reference.html#MapsEventListener щодо методів, що дозволяють додавати слухачі подій.

На це питання є багато відповідей, які ніколи не працювали для мене (включаючи пропозицію getPosition (), яка, здається, не є доступним методом для об’єктів маркерів). Єдиний метод, який працював у мене на картах V3 (це просто):

var lat = marker.lat();
var long = marker.lng();