Angular-google-maps: Jendela info bocor

Dibuat pada 18 Des 2016  ·  4Komentar  ·  Sumber: SebastianM/angular-google-maps

Deskripsi masalah

Jika Anda menggunakan penanda dengan jendela info yang terlihat - pertumbuhan penggunaan CPU hingga 100% dari inti. Diuji dengan Chrome.

Langkah-langkah untuk mereproduksi dan demo minimal masalah

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

Langkah-langkah untuk mereproduksi:

  1. Buka pengelola tugas Chrome (Menu - Alat Lainnya - Pengelola Tugas)
  2. Periksa apakah penggunaan CPU oleh plunkr rendah dan tidak bertambah
  3. Klik tombol "toggle info" (Jendela info akan ditampilkan setelah klik)
  4. Pantau penggunaan CPU selama 1 menit (Anda akan melihatnya berkembang seiring waktu)
  5. (Opsional) Klik tombol "toggle info" lagi (penggunaan CPU tetap tinggi bahkan setelah jendela info ditutup)

Perilaku saat ini

Penanda dengan jendela info terbuka menggunakan lebih banyak CPU dari waktu ke waktu

Perilaku yang diharapkan/diinginkan

Penggunaan CPU yang konstan

versi angular2 & angular2-google-maps

2.1.1 & 0.16.0

Informasi lainnya

urgent AgmInfoWindow stale bug

Komentar yang paling membantu

Saya menemukan solusi di sini: https://github.com/angular/angular/issues/10883#issuecomment -240423378
Jadi yang saya lakukan adalah memanggil infoWindow.open()/close() di luar Angular untuk menghindari deteksi perubahan:

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();
    });
  }

Semua 4 komentar

Ya. Saya menemukan masalah yang sama.
Dan saya juga menggunakan angular2.
Alasannya adalah ketika jendela info dibuka, halaman akan mendeteksi berubah lagi dan lagi, seperti loop. Jadi halaman akan digambar ulang lagi dan lagi. Percepat. itu adalah masalah besar.

Adakah pembaruan/kemajuan tentang masalah ini? @SebastianM

Saya menemukan solusi di sini: https://github.com/angular/angular/issues/10883#issuecomment -240423378
Jadi yang saya lakukan adalah memanggil infoWindow.open()/close() di luar Angular untuk menghindari deteksi perubahan:

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();
    });
  }

Masalah ini secara otomatis ditandai sebagai basi karena tidak ada aktivitas terbaru. Ini akan ditutup jika tidak ada aktivitas lebih lanjut yang terjadi. Terima kasih atas kontribusi Anda.

Apakah halaman ini membantu?
0 / 5 - 0 peringkat