Google Maps HTML5 нажмите, чтобы получить долгую, длинную - PullRequest
28 голосов
/ 06 ноября 2011

Я пытаюсь создать мобильное веб-приложение HTML5, в котором пользователь может щелкнуть карту, чтобы получить широту / долготу из Карт Google. Есть ли пример кода? Я попробовал поискать в Google, но нашел только какой-то веб-сайт, который делает это, но без примера soucecode.

Это потому, что я собираюсь сначала использовать геолокацию HTML5 для отображения текущего местоположения, но если оно не точное, тогда пользователи могут указать это самостоятельно.

Большое спасибо.

Ответы [ 3 ]

52 голосов
/ 06 ноября 2011

Код ниже покажет вам, как получить Long и Lat, когда пользователь нажимает карту - Разрешить пользователю размещать маркер на карте Google

google.maps.event.addListener(map, 'click', function( event ){
  alert( "Latitude: "+event.latLng.lat()+" "+", longitude: "+event.latLng.lng() ); 
});
4 голосов
/ 03 сентября 2017

Я хочу показать вам полный ответ:

это основная часть кода, на котором основано событие, щелкнуть и получить широту / долготу с помощью щелчка и показать его в alert ()

google.maps.event.addListener (карта, «щелчок», функция (событие) { alert (event.latLng.lat () + "," + event.latLng.lng ()); });

<!DOCTYPE html>
<html>
<body>
<div id="googleMap" style="width:100%;height:400px;"></div>

<script>
function myMap() {
var mapProp= {
    center:new google.maps.LatLng(51.508742,-0.120850),
    zoom:5,
};
var map=new google.maps.Map(document.getElementById("googleMap"),mapProp);

google.maps.event.addListener(map, 'click', function(event) {
alert(event.latLng.lat() + ", " + event.latLng.lng());
});

}
</script>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBu-916DdpKAjTmJNIgngS6HL_kDIKU0aU&callback=myMap"></script>
</body>
</html>

пожалуйста, измените КЛЮЧ API

SRC = "https://maps.googleapis.com/maps/api/js?key=AIzaSyBu-916DdpKAjTmJNIgngS6HL_kDIKU0aU&callback=myMap"

поместите ключ API между key = и & callback :

https://maps.googleapis.com/maps/api/js?key= @@@@@@@ & callback = myMap

2 голосов
/ 06 июня 2017

Вы должны использовать аргумент события.

 google.maps.event.addListener(map, 'click', function(event) {
     marker = new google.maps.Marker({position: event.latLng, map: map});
     console.log(event.latLng);   // Get latlong info as object.
     console.log( "Latitude: "+event.latLng.lat()+" "+", longitude: "+event.latLng.lng()); // Get separate lat long.
 });
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...