Was wondering if anyone has any experience or could help with the logic, to track a user (car) with Bing maps
As the user travels a line should be drawn of their journey, but snap to roads, the way I have things set at the moment, lines will be drawn through buildings.
Because whenever there is an update to the position, 2 points are calculated and a line is added to the map
(At the moment am using watchPosition but in future will get position every 30 seconds)
watchPos() {
let options = { timeout: 60000 }
this.watchId = navigator.geolocation.watchPosition((position) => {
this.lat = position.coords.latitude;
this.lng = position.coords.longitude;
this.setMap()
console.log(this.lat, this.lng)
}, this.errorHandler, options);
}
setMap() {
this.loc = new Microsoft.Maps.Location(this.lat, this.lng);
if (!this.initialised) {
this.oldLoc = this.loc;
this.initialised = true
this.map = new Microsoft.Maps.Map(this.driveMap.nativeElement, {
credentials: CONFIG.BING_API_KEY,
center: this.loc,
mapTypeId: Microsoft.Maps.MapTypeId.road,
navigationBarMode: 2,
zoom: this.zoom
});
this.user = new Microsoft.Maps.Pushpin(this.loc, { icon: '../images/icon.svg' });
this.map.entities.push(this.user);
// console.log(loc)
} else {
// Draw line
// from this.oldLoc to this.loc
let lineVertices = new Array(this.oldLoc, this.loc);
let line = new Microsoft.Maps.Polyline(lineVertices);
// Then set oldLoc to new loc
this.oldLoc = this.loc
this.map.entities.push(line);
this.map.setView({
center: this.loc
});
this.user.setLocation(this.loc);
}
}
