I encountered an issue while trying to integrate Google Maps into my project, even though everything seems to be set up correctly. When I simply search for a location, it works fine and I can get there, but when I attempt to display a route as per the Google documentation, I receive an error message. Is it possible that Google is not being recognized somehow?
ngOnInit() {
this.initializeMap();
}
initializeMap() {
Geolocation.getCurrentPosition()
.then((resp) => {
let latLng = new google.maps.LatLng(
resp.coords.latitude,
resp.coords.longitude
);
let mapOptions = {
center: latLng,
zoom: 15,
mapTypeId: google.maps.MapTypeId.ROADMAP,
};
this.map = new google.maps.Map(
this.mapElement.nativeElement,
mapOptions
);
this.directionsRenderer.setMap(this.map);
})
.catch((error) => {
console.log("Error getting location", error);
});
}
calculateAndDisplayRoute() {
this.directionsService.route(
{
origin: this.currentLatLng, //takes the current location
destination: this.currentLatLng,
waypoints: this.waypointArray,
optimizeWaypoints: true,
travelMode: google.maps.Travelmode.DRIVING,//here's the problem
drivingOptions: {
trafficModel: "pessimistic",
},
},
(response, status) => {
if (status === "OK") {
this.directionsRenderer.setDirections(response);
}
}
);
}