Ionic native google maps marker issues

Question

I am building an ionic 3 app and trying to make the htmlInfoWIndow to show up on a map but without any luck. I am using the following versions: "@ionic-native/google-maps": "4.4.2", "cordova-plugin-googlemaps": "^2.1.1",

loadMap() {
    let mapOptions: GoogleMapOptions = {
      camera: {
        target: {
          lat: 43.0741904,
          lng: -89.3809802
        },
        zoom: 18,
        tilt: 30
      }
    };

    this.map = GoogleMaps.create('map', mapOptions);

    // Wait the MAP_READY before using any methods.
    this.map.one(GoogleMapsEvent.MAP_READY)
      .then(() => {
        console.log('Map is ready!');

        let htmlInfoWindow = new HtmlInfoWindow();

        let html = [
          '<h2>Title here....</h2>'
        ].join("");
        htmlInfoWindow.setContent(html);

        // Now you can use all methods safely.
        this.map.addMarker({
          position: {
            lat: 43.0741904,
            lng: -89.3809802
          }
        })
          .then((marker: Marker) => {
            marker.on(GoogleMapsEvent.MARKER_CLICK)
              .subscribe(() => {
                htmlInfoWindow.open(marker);
                console.log('sad');
              });
          });


      });
  }

loadMap() function is initialized on ionicviewenter. The console log is printed out but no info window is appearing on marker click.

Any ideeas what i am doing wrong? Thanks, Trix

Answer 1

check that (go to diapositive 42)

https://docs.google.com/presentation/d/e/2PACX-1vScoho1ensbR4qCI9AIuQN55BZVvK73pAjI7sumDvW3CrxxHnrmpXWUjx2-8CpFibqU1EjLKCRhuthJ/pub?start=false&loop=false&delayms=3000