I am generating a Google Map in my Ionic app, setting the center of the map to my co-ordinates using Geolocation, & adding a marker to the map (using the same co-ordinates):
All the below code is working fine at the moment:
ionViewWillEnter() {
this.anonLogin();
this.loadMap();
}
anonLogin() {
this.afAuth.auth.signInAnonymously().then(res => {
this.user = res.user;
this.watch = Geolocation.watchPosition({}, (position, err) => {
if (position) {
this.latLng = new google.maps.LatLng(position.coords.latitude, position.coords.latitude);
console.log('position change: ' + this.latLng);
this.updateMarker();
}
});
});
}
loadMap() {
Geolocation.getCurrentPosition().then((resp) => {
this.latLng = new google.maps.LatLng(resp.coords.latitude, resp.coords.longitude);
}).then(() => {
let mapOptions = {
center: this.latLng,
zoom: 15,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var marker = new google.maps.Marker({
position: this.latLng,
title: "Hello World!"
});
this.map = new google.maps.Map(this.mapElement.nativeElement, mapOptions);
marker.setMap(this.map);
}).catch((err) => {
console.log(err);
});
}
But when my location changes, I want the marker to move along with my location on the map also.
That is why I called this.updateMarker()
above inside the Geolocation watch.
But it doesn’t look like the marker is being updated currently, here is what I have inside updateMarker()
:
updateMarker() {
var marker = new google.maps.Marker({
position: this.latLng,
title: "Hello World!"
});
marker.setMap(this.map);
}
Can someone please tell me why my marker is not updating, & what changes are required so that it does?