0

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();
    }
JYMM
  • 1
  • 1

0 Answers0