我正在尝试实现需要跟踪用户位置的功能,首先,我使用getCurrentLocation检索用户的位置,然后传递坐标以放置指示用户位置的标记(设置了marker变量)全局),然后调用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);
};
最佳答案
基本上这里的错误是$ cordovaGeolocation造成的,用navigator.geolocation代替了它为我解决了这个问题。