All
Я ни в коем случае не программист на JavaScript, в основном повторно использующий / переназначающий фрагменты здесь и там для достижения цели. В настоящее время я пытаюсь обойти ограничение карт Google, которое заключается в том, что карты нельзя стилизовать (AFAICT), если вы не выберете свою собственную. У меня есть рабочая HTML-страница, которая содержит карту Google, в которой правильно используются стили и геолокация карт Google, чтобы установить в центре карты местоположение пользователя.
Мой вопрос:
Как сохранить карту по центру на месте пользователя, если его местоположение меняется при открытой странице?
Поищите, как я, возможно, мне не удалось найти пример, где геолокация обновляется с помощью JavaScript. Возможно, это невозможно, может быть, документация API Google слаба, или, возможно, мой Google-фу воняет. Возможно, все три.
Мой код (почти дословно взят из документации Google Maps):
<body>
<div id="map"></div>
<script>
var map, infoWindow;
function initMap() {
map = new google.maps.Map(document.getElementById('map'), {
center: {lat: 38.391677, lng: -97.661646},
zoom: 17,
styles: [...]
});
infoWindow = new google.maps.InfoWindow;
// Try HTML5 geolocation.
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(position) {
var pos = {
lat: position.coords.latitude,
lng: position.coords.longitude
};
infoWindow.setPosition(pos);
infoWindow.setContent('Location found.');
infoWindow.open(map);
map.setCenter(pos);
}, function() {
handleLocationError(true, infoWindow, map.getCenter());
});
} else {
// Browser doesn't support Geolocation
handleLocationError(false, infoWindow, map.getCenter());
}
}
function handleLocationError(browserHasGeolocation, infoWindow, pos) {
infoWindow.setPosition(pos);
infoWindow.setContent(browserHasGeolocation ?
'Error: The Geolocation service failed.' :
'Error: Your browser doesn\'t support geolocation.');
infoWindow.open(map);
}
</script>
<script async defer
src="https://maps.googleapis.com/maps/api/js?key=********************************&callback=initMap">
</script>
</body>