Close marker info windows when a new one clicked?

[SteveDowsett]

Is is possible to do this?

[lauwrentius]

Yup, I've encountered the same issue before.

Here's the working plunk
http://plnkr.co/edit/cwuwBN?p=preview

[lsnascimento]

i could not use this approach.
My solution was downloaded the sources and include the following code in the file (google-map-info-window.ts):

// set this property in the top file, below let infoWindowId = 0; (line 7)
let infoWindowLastContext: SebmGoogleMapInfoWindow = null;

open(): Promise {
if(infoWindowLastContext !== null) {
this._infoWindowManager.close(infoWindowLastContext)
}

infoWindowLastContext = this;

return this._infoWindowManager.open(this); 

}

I hope this helps...

[soyersoyer]

My template only solution:

<sebm-google-map #gm [latitude]="lat" [longitude]="lng" [zoom]="zoom" [scrollwheel]="false" [styles]="mapStyles">
	<sebm-google-map-marker *ngFor="let place of places"
	[latitude]="place.point.lat"
	[longitude]="place.point.lng"
	[label]="place.name[0]"
	(markerClick)="gm.lastOpen?.close(); gm.lastOpen = infoWindow">
	<sebm-google-map-info-window #infoWindow>
		<strong>{{place.name}}</strong>
	</sebm-google-map-info-window>
</sebm-google-map-marker>

[ekaitzht]

@soyersoyer @lazarljubenovic

<agm-map #gm [latitude]="lat" [longitude]="lng" [zoom]="zoom" [scrollwheel]="false" [styles]="mapStyles">
	<sebm-google-map-marker *ngFor="let place of places"
	[latitude]="place.point.lat"
	[longitude]="place.point.lng"
	[label]="place.name[0]"
	(markerClick)="gm.lastOpen?.close(); gm.lastOpen = infoWindow">
	<agm-info-window #infoWindow>
		<strong>{{place.name}}</strong>
	</agm-info-window>
</agm-marker>

With the new 1.0.0-beta.0 - green-zebra AOT is not working:
Property 'lastOpen' does not exist on type 'AgmMap'

What can be happen?

[Martin-B]

Works great, my template usage invokes a custom click function as in

(markerClick)="gm.lastOpen?.close(); gm.lastOpen = infoWindow; markerClicked(m);"

[melbouhy]

Hello,

Even with @Martin-B solution, it doesn't work :/

Any help ?

[rubyboy]

@Martin-B thanks heaps for the solution. Works a treat!

[Eirenempada]

@Martin-B Nice thx !
@melbouhy Shame on me; forgot to add #infoWindow in <agm-info-window>. Maybe you did the same mistake ?

[sergamers]

<agm-marker (markerClick)="openIW(infoWindow)">
<agm-info-window #infoWindow>

public openIW(data = undefined){
if(this.IW){
this.IW.close();
}

this.IW = data;

}

[menakav]

@Martin-B how to use this ((markerClick)="gm.lastOpen?.close(); gm.lastOpen = infoWindow; markerClicked(m);") in agm-marker please reply with .ts code

[AzimbekMakhmudov]

@menakav Here is a worked code:
in .ts file:
`
markerClicked(infoWindow) {
if( this.infoWindowOpened === infoWindow)
return;

    if(this.infoWindowOpened !== null)
    {
        this.infoWindowOpened.close();
    }

    this.infoWindowOpened = infoWindow;
}

in .html file:(markerClick)="gm.lastOpen?.close(); gm.lastOpen = infoWindow; markerClicked(m);"`

[gabrielizalo]

@menakav Your code don't works for me
:(

I tested all the codes in this forum, and my problem is the infoWindow received here:

  clickedMarker(infoWindow, index: number) {
    ...
  }

infoWindow always is the first one, no matter how any points I have. Always I received the infoWindow with _id = 0.

The parameter index receives the true ID of the clicked marker....

This is my html:

<agm-marker *ngFor="let point of points; let i = index" [latitude]="point.latitude"
                            [longitude]="point.longitude"
                            [iconUrl]="iconUrl" (markerClick)="clickedMarker(infoWindow, i)">
<agm-info-window [disableAutoPan]="true" #infoWindow *ngIf="!isDetailMovil">
        <div class="marker__tittle">{{point.name}}</div>

Any ideas why always is coming the same infoWindow?

[markschmid]

@soyersoyer 's "template only" solution works great. However, once the initial agm-marker array is replaced with new marker elements (e.g. after ajax update), all of a sudden, the previous infowindows don't close automatically anymore. What could be the problem here?

[songsq]

@markschmid my workaround when the initial agm-marker array is replaced.
(markerClick)="tmp=gm.lastOpen;gm.lastOpen=infoWindow;tmp?.close();"