Google Maps API：在不重新加载地图的情况下关注并居中我的观察位置

Posted 2023-02-23

【中文标题】Google Maps API：在不重新加载地图的情况下关注并居中我的观察位置

【英文标题】：GoogleMaps API: Follow and Center my watchpostion without reloading the map

【发布时间】：2014-02-08 11:18:32

【问题描述】：

几个月以来，我一直在寻找解决方案。我发现了非常有趣的东西——比如 Google Maps Library Utilities，但没有什么可以帮助我。

我想通过使用 watchPosition 并在不重新加载地图的情况下跟随（中心）我的位置来获取我在谷歌地图上的位置。

每次我将位置集中在 watchPosition 上时，它都会重新加载地图。也许有一种方法可以叠加，但不幸的是，我缺乏这方面的知识。

最好的方法是使用 Google Maps Library Utilities 中的 Geomarker。但这里也一样。我无法居中。

也许任何人都可以帮助我提供一个可行的示例。

【参考方案1】：

var map;
            var GeoMarker;
            function initialize() 
                var mapOptions = 
                    zoom: 12,
                    center: new google.maps.LatLng(-34.397, 150.644),
                    mapTypeId: google.maps.MapTypeId.ROADMAP
                ;
                map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);

                GeoMarker = new GeolocationMarker();
                GeoMarker.setCircleOptions(fillColor: '#808080');
                google.maps.event.addListenerOnce(GeoMarker, 'position_changed', function() 
                    map.setCenter(this.getPosition());
                    map.fitBounds(this.getBounds());
                );

                navigator.geolocation.watchPosition(function(position) 
                    var latitude = position.coords.latitude;
                    var longitude = position.coords.longitude;
                    var geolocpoint = new google.maps.LatLng(latitude, longitude);
                    map.setCenter(geolocpoint);
                );

                google.maps.event.addListener(GeoMarker, 'geolocation_error', function(e) 
                    alert('There was an error obtaining your position. Message: ' + e.message);
                );
                GeoMarker.setMap(map);
            

            google.maps.event.addDomListener(window, 'load', initialize);
            if(!navigator.geolocation) 
                alert('Your browser does not support geolocation');
            

【参考方案2】：

您无需重新加载地图。

使用标记的setPosition-方法应用新位置（如果可用），使用地图的setCenter-方法应用新中心。