Google Maps API 3: Obtenir Les coordonnées à partir D'un clic droit
J'ai 2 zones de texte pour lat et lon pour quand un utilisateur entre un nouvel enregistrement dans la base de données.
J'ai un aperçu en direct de Google Maps qui fonctionne très bien, maintenant ce que je veux faire est d'ajouter un événement clic droit sur la carte qui remplit les zones de texte lat/lon avec le coord cliqué.
Est-ce même possible?
Je sais comment ajouter l'écouteur d'événement, et j'ai regardé à travers les documents de L'API, mais je n'ai rien vu qui fasse cela. Je sais que vous pouvez le faire sur la carte de google sur leur site.
2 réponses
google.maps.event.addListener(map, "rightclick", function(event) {
var lat = event.latLng.lat();
var lng = event.latLng.lng();
// populate yor box/field with lat, lng
alert("Lat=" + lat + "; Lng=" + lng);
});
Vous pouvez créer un objetInfoWindow (documentation de classe ici ) et y attacher un gestionnaire d'événements rightclick
qui le remplira avec la latitude et la longitude de l'emplacement cliqué sur la carte.
function initMap() {
var myOptions = {
zoom: 6,
center: new google.maps.LatLng(-33.8688, 151.2093)
},
map = new google.maps.Map(document.getElementById('map-canvas'), myOptions),
marker = new google.maps.Marker({
map: map,
}),
infowindow = new google.maps.InfoWindow;
map.addListener('rightclick', function(e) {
map.setCenter(e.latLng);
marker.setPosition(e.latLng);
infowindow.setContent("Latitude: " + e.latLng.lat() +
"<br>" + "Longitude: " + e.latLng.lng());
infowindow.open(map, marker);
});
}
html,
body {
height: 100%;
}
#map-canvas {
height: 100%;
width: 100%;
}
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAIPPUQ0PSWMjTsgvIWRRcJv3LGfRzGmnA&callback=initMap" async defer></script>
<div id="map-canvas"></div>