I'm using this google map angular component tutorial and it's working pretty good! BUT opening up an info window throws an exception.
Here is my code that calls "this.infoWindow.open" method on a "MapInfoWindow" component from the npm package.
import {
MapInfoWindow,
MapMarker,
GoogleMap
} from '@angular/google-maps';
export class YogabandEventsComponent implements OnInit {
@ViewChild(MapInfoWindow, {
static: false
}) infoWindow: MapInfoWindow;
@ViewChild(GoogleMap, {
static: false
}) googleMap: GoogleMap;
openInfo(marker: MapMarker, content) {
this.infoContent = content;
this.infoWindow.open(marker);
}
}<google-map [options]="options" [zoom]="zoom" [center]="center" class="h-100" height="100%" width="100%">
<map-marker #markerElem *ngFor="let marker of markers" (mapClick)="openInfo(markerElem, marker.info)" [position]="marker.position" [label]="marker.label" [title]="marker.title" [options]="marker.options">
</map-marker>
<map-info-window>{{ infoContent }}</map-info-window>
</google-map>When
infoWindow.open(marker)
is called it enters
google-maps.js // line 1122
but receives an error on line 1122, because there is no "getAnchor()" method
this.infoWindow.open(this._googleMap.googleMap, anchor ? anchor.getAnchor() : undefined);
// in google-maps.js
open(anchor) {
this._assertInitialized();
this._elementRef.nativeElement.style.display = '';
this.infoWindow.open(this._googleMap.googleMap, anchor ? anchor.getAnchor() : undefined); // line 1122
}I looked through the google docs and I don't see any "getAnchor" method.
Here is what I see in the debugger when setting a breakpoint in my component.
Here is what it shows in the debug console when I look at 'marker', so it has values and is instantiated!
I can copy and paste the whole thing but it's long.
Here is another pic of debug console, inside google-maps.js file, trying to call the getAnchor() with no luck becasue it doesn't exist.
