I'm working with an ionic 6 app with Capacitor Google map plugin (@capacitor/google-maps). Adding a marker works. but when I try to add Polylines, it give me an error. Property 'addPolylines' does not exist on type 'GoogleMap'. and Cannot find name 'PolylineOptions'.
I'm using
"@capacitor/google-maps": "^4.5.1",
It gives the impression that Capacitor Google Maps doesn't support Polylines, but it's there in the documentation:
addPolylines(polylines: Polyline[]) => Promise<string[]>
Does Capacitor Google Map plugin actually supports Polyline?
This is my create map function:
async createMap(latitude,longitude) {
const loading = await this.loadingController.create();
await loading.present();
const mapRef = document.getElementById('map');
this.map = await GoogleMap.create({
id: 'map',
element: mapRef,
apiKey: environment.apiKey,
config: {
//disableDefaultUI: true,
center: {
lat: latitude,
lng: longitude,
},
zoom: 14,
},
});
const markerId = await this.map.addMarker({
coordinate: {
lat: this.latitude,
lng: this.longitude
}
});
// Create a new polyline
const polyline: PolylineOptions = {
path: [
new LatLng(37.4232, -122.0853),
new LatLng(37.4292, -122.0953),
new LatLng(37.4352, -122.1053),
new LatLng(37.4402, -122.1153),
],
strokeColor: "#FF0000",
strokeWeight: 5,
geodesic: true,
};
// Add the polyline to the map
const polylineId = await this.map.addPolylines(polyline);
await loading.dismiss();
}