Issue description
If you are using marker with a visible info window - CPU usage growth up to 100% of the core. Tested with Chrome.
Steps to reproduce and a minimal demo of the problem
http://plnkr.co/edit/q0ttx1XbTCnB4DFujtRV?p=preview
Steps to reproduce:
Current behavior
Marker with an open info window uses more and more CPU over time
Expected/desired behavior
Constant CPU usage
angular2 & angular2-google-maps version
2.1.1 & 0.16.0
Other information
yes. I found same issue.
And i using angular2 too.
The reason is when info window opend, the page would detect changed again and again, like a loop. So the page would redraw again and again. Hurry up. it is a big issue.
Any update/progress on this issue? @SebastianM
I found a solution here: https://github.com/angular/angular/issues/10883#issuecomment-240423378
So what I did is call the infoWindow.open()/close() outside of Angular to avoid change detections:
map.component.html
<div *ngFor="let property of _properties">
<agm-marker [latitude]="property.Lat"
[longitude]="property.Lng"
[iconUrl]="_markerIconUrl"
(mouseOver)="_infoWindowOpen($event, infoWindow);"
(mouseOut)="_infoWindowClose($event, infoWindow);">
</agm-marker>
</div>
...
<agm-info-window #infoWindow>
</agm-info-window>
map.component.ts
import { Component, OnInit, NgZone } from '@angular/core';
...
constructor(private _zone: NgZone) {...}
...
private _infoWindowOpen(mouseEvent: any, infoWindow: any) {
infoWindow.hostMarker = mouseEvent.marker;
this._zone.runOutsideAngular(() => {
infoWindow.open();
});
}
...
private _infoWindowClose(mouseEvent: any, infoWindow: any) {
this._zone.runOutsideAngular(() => {
infoWindow.close();
});
}
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.
Most helpful comment
I found a solution here: https://github.com/angular/angular/issues/10883#issuecomment-240423378
So what I did is call the infoWindow.open()/close() outside of Angular to avoid change detections:
map.component.html
map.component.ts