Angular-google-maps: 信息窗口泄漏

创建于 2016-12-18  ·  4评论  ·  资料来源: SebastianM/angular-google-maps

问题描述

如果您使用带有可见信息窗口的标记 - CPU 使用率增长高达 100% 的核心。 用 Chrome 测试。

重现步骤和问题的最小演示

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

重现步骤:

  1. 打开 Chrome 任务管理器(菜单 - 更多工具 - 任务管理器)
  2. 检查 plunkr 的 CPU 使用率是否很低并且没有增长
  3. 单击“切换信息”按钮(单击后应显示信息窗口)
  4. 监控 CPU 使用情况 1 分钟(您会看到它随着时间的推移而增长)
  5. (可选)再次单击“切换信息”按钮(即使关闭信息窗口,CPU 使用率仍然很高)

当前行为

随着时间的推移,带有打开信息窗口的标记使用越来越多的 CPU

预期/期望行为

恒定的 CPU 使用率

angular2 和 angular2-google-maps 版本

2.1.1 & 0.16.0

其他信息

urgent AgmInfoWindow stale bug

最有用的评论

我在这里找到了一个解决方案: https :
所以我所做的是在 Angular 之外调用 infoWindow.open()/close() 以避免更改检测:

地图.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>

地图组件.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();
    });
  }

所有4条评论

是的。 我发现了同样的问题。
我也使用 angular2。
原因是当信息窗口打开时,页面会检测到一次又一次的变化,就像一个循环。 所以页面会一次又一次地重绘。 赶快。 这是一个大问题。

关于这个问题的任何更新/进展? @SebastianM

我在这里找到了一个解决方案: https :
所以我所做的是在 Angular 之外调用 infoWindow.open()/close() 以避免更改检测:

地图.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>

地图组件.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();
    });
  }

此问题已自动标记为过时,因为它最近没有活动。 如果没有进一步的活动发生,它将被关闭。 感谢你的贡献。

此页面是否有帮助?
0 / 5 - 0 等级

相关问题

DeveloperAdd007 picture DeveloperAdd007  ·  3评论

mensch picture mensch  ·  3评论

maneesht picture maneesht  ·  3评论

Subhojit1992 picture Subhojit1992  ·  3评论

dineshkumar20 picture dineshkumar20  ·  3评论