Обновление маркера Google Maps

Question

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

@ push ('scripts')

        // Note: This example requires that you consent to location sharing when
        // prompted by your browser. If you see the error "The Geolocation service
        // failed.", it means you probably did not give permission for the browser to
        // locate you.
        var map, infoWindow;
        function initMap() {
            let spain = {lat:40.417953, lng: -3.714312};
            map = new google.maps.Map(document.getElementById('map'), {
                center: spain,
                zoom: 15
            });

            infoWindow = new google.maps.InfoWindow;
            let markers = {!! $markers->toJson() !!};

            let hotspotLoc = {
                lat: markers[0].lat,
                lng: markers[0].lng
            };
            map.setCenter(hotspotLoc);

            // Loading in Markers from the database
            $.each(markers, function (key, marker) {
                let id = marker.id;
                let name = marker.name;
                let addres = marker.addres;
                let lesson = 0;
                if (marker.lesson && marker.lesson.length > 0) {
                    lesson = marker.lesson[0].id;
                }

                let lat = marker.lat;
                let lng = marker.lng;
                let type = marker.type;

                let markerLatlng = new google.maps.LatLng(parseFloat(lat), parseFloat(lng));

                let mark = new google.maps.Marker({
                    position: markerLatlng,
                    map: map,
                    lesson: lesson
                });

                // Trigger marker when moving near to it
                new google.maps.event.trigger(markers, 'click');

                mark.setMap(map);
            });
            // 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('Current location');
                    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 src="https://maps.googleapis.com/maps/api/js?key={{env('G_MAPS_API')}}&callback=initMap"
            async defer></script>

Вот мой сценарий, надеюсь, кто-то знает, как решить эту проблему.

Answer 1

Добро пожаловать в stackoverflow.

Я бы предложил попробовать watchPosition() ( Документы здесь & Здесь ) вместо getCurrentPosition().

Таким образом, вы изменили бы:

navigator.geolocation.getCurrentPosition(function(position) {});

На что-то вроде:

navigator.geolocation.watchPosition(function(position) {
   var pos = {
     lat: position.coords.latitude,
     lng: position.coords.longitude
   };
   map.setCenter(pos);
});