谷歌地图 WatchPosition 无法正常工作

Posted

技术标签:

【中文标题】谷歌地图 WatchPosition 无法正常工作【英文标题】:Google map WatchPosition doesn't work properly 【发布时间】:2018-01-02 00:20:42 【问题描述】:

我正在尝试实现一个需要跟踪用户位置的功能,首先,我使用 getCurrentLocation 检索用户的位置,然后传递坐标以放置指示用户位置的标记(标记变量是全局设置的),然后我调用 watchPosition 函数,以便它可以跟踪用户位置(如果其位置已更改)。 此代码是为 Ionic 应用程序实现的,但相同的逻辑将用于任何 Web 应用程序(您可以忽略 $cordovaGeolocation,因为它与 navigator.geolocation 相同)

var map = null;
var myPosition = null;

$scope.initMap = function()
    var posOptions = 
        enableHighAccuracy: false,
        timeout: 20000,         
    ;

    $cordovaGeolocation.getCurrentPosition(posOptions).then(
        function (position) 
            var lat  = position.coords.latitude;
            var long = position.coords.longitude;
            var myLatlng = new google.maps.LatLng(lat, long);               
            $scope.me = myLatlng;

            var mapOptions = 
                center: myLatlng,
                zoom: 11,
                disableDefaultUI: true,
                mapTypeId: google.maps.MapTypeId.ROADMAP,

            ;          

            map = new google.maps.Map(document.getElementById("map"), mapOptions); 

            myPosition = new google.maps.Marker(
                map: map,
                position: myLatlng,
                draggable:false,
                icon: "http://i.stack.imgur.com/orZ4x.png",
            );             
            var circle = new google.maps.Circle(radius: User.getUser().distance*1000, center: myLatlng); 
            map.fitBounds(circle.getBounds());              
            $cordovaGeolocation.watchPosition(win);
        ,
        function(err) 
            console.log(err);
        
    );

watchPosition 函数的回调如下:

var win = function(position) 
    var lat = position.coords.latitude;
    var long = position.coords.longitude;
    var myLatlng = new google.maps.LatLng(lat, long);
    if(myPosition==null)
        myPosition = new google.maps.Marker(
            map: map,
            position: myLatlng,
            draggable:false,
            icon: "http://i.stack.imgur.com/orZ4x.png",
        );
        myPosition.setMap(map);
    else
        myPosition.setPosition(myLatlng);
    
    map.panTo(myLatlng);
;

【问题讨论】:

【参考方案1】:

这里的错误基本上是 $cordovaGeolocation 的问题,用 navigator.geolocation 替换它为我解决了这个问题。

【讨论】:

以上是关于谷歌地图 WatchPosition 无法正常工作的主要内容,如果未能解决你的问题,请参考以下文章

带有 html 5 观察位置的谷歌地图(防止地图刷新)

谷歌地图 fitBounds 无法正常工作

在 Play 商店发布应用程序后,谷歌地图无法正常工作

谷歌地图 api findplace 请求无法正常工作

Android 谷歌地图在 APK 发布后无法正常工作

谷歌地图不会居中