我想使用谷歌地图来获取用户的当前lat和lon:
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCfbbmUkl56UuSeZ5nSOwsKTNxplmnheuU&callback=initialize&language=en" async defer></script>
用户应该更改标记,我会得到新的lat和lon。
可以这样做吗?
答案 0 :(得分:3)
使用HTML地理位置方法自动检测用户位置的代码段。运行此应用程序时,请确保您的浏览器启用了位置,并提供了正确的Google地图API链接,并且最无能为力的是API密钥。这是MDN Using geolocation的链接,您可以在其中找到有关地理位置和浏览器支持信息的详细信息。
<!DOCTYPE html>
<html>
<body>
<p>Click the button to get your coordinates.</p>
<button onclick="getLocation()">Click Me to show Your Location.</button>
<div id="map" style="width:100%;height:500px"></div>
<script>
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
alert("Geolocation is not supported by this browser.");
}
}
function showPosition(position) {
var lat = position.coords.latitude;
var lng = position.coords.longitude;
var myCenter = new google.maps.LatLng(lat, lng);
var mapCanvas = document.getElementById("map");
var mapOptions = {
center: myCenter,
zoom: 5
};
var map = new google.maps.Map(mapCanvas, mapOptions);
var marker = new google.maps.Marker({
position: myCenter
});
marker.setMap(map);
// Zoom to 9 when clicking on marker
google.maps.event.addListener(marker, 'click', function () {
map.setZoom(9);
map.setCenter(marker.getPosition());
});
}
</script>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBu-916DdpKAjTmJNIgngS6HL_kDIKU0aU&callback=myMap"></script>
</body>
</html>
希望这会对您有所帮助