Angular-google-maps: Map should recenter on resize.

[mvanderlee]

Map should recenter on window resize.

Current behavior is that the image is locked to the top left corner and expands/contracts from there.

[SebastianM]

@DDuTCH you could do something like this in your component with the latest version:

@ViewChild(AgmMap) myMap: AgmMap;

@HostListener('window:resize')
onWindowResize() {
  this.myMap.triggerResize();
}

[mvanderlee]

That didn't recenter the map for me, I had to call setCenter on the Google map API once the resize completed..

@ViewChild(AgmMap) myMap: any;

@HostListener('window:resize')
onWindowResize() {
  this.myMap.triggerResize()
    .then(() =>  this.myMap._mapsWrapper.setCenter({lat: this.lat, lng: this.lng}));
}

[efstathiosntonas]

@DDuTCH i'm using your example but i get:
Property '_mapsWrapper' is private and only accessible within class 'AgmMap'.

how did you manage to get it working? Thanks

[mvanderlee]

http://plnkr.co/edit/Iz23kt?p=preview

@ViewChild(AgmMap) private map: any;

[beaulac]

To keep type-safety in the rest of your code, and only violate accessibility for this particular workaround, you could instead do:

@ViewChild(AgmMap) myMap: AgmMap;

......

// Specific type 'de-assertion' for only this call:
    .then(() =>  (this.myMap as any)._mapsWrapper.setCenter({lat: this.lat, lng: this.lng}));

[bogacg]

I see there is a commit faea24d that says it auto-centers on triggerResize now, but it didn't work and I had to use code given here.

[VinceBT]

Following this issue since the recenter parameter does nothing 99% of the time

[KLTR]

@beaulac Thanks! I have been trying to get this for 2 days of work. I love you man

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.