Показывать информационное окно при наведении курсора мыши на информационное окно на картах Google

Question

Я отображаю маркеры на карте, текущее поведение таково, что, когда я наводю курсор мыши на маркеры, появляется соответствующее информационное окно и отображаются соответствующие данные, а когда я щелкаю мышью по маркеру, всплывающее окно исчезает (исчезает), я не в состоянии парить информационное окно в то время, когда информационное окно всплывает из-за наведения на маркеры, я ищу способ, чтобы при наведении курсора на информационное окно оно оставалось на экране, а когда я зависал из тогда infowindow может исчезнуть

Я использую приложение angular 7. И в рамках этого я использую angular встроенную библиотеку карт https://angular-maps.com/.

У меня есть массив myData:[{ lat: 40.45,long: -70.12 },{ lat: 41.97,long: -69.12 },{ lat: 40.05,long: -71.12 }]

Я показываю маркеры Google на картах Google с помощью следующего кода.

app.component.ts

import { Component,OnInit, ElementRef, ViewChild, NgZone } from '@angular/core';
declare var google;

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent implements OnInit {
  public latitude: number;
  public longitude: number;
  myData:any = [{ lat: 40.45,long: -70.12 },{ lat: 41.97,long: -69.12 },{ lat: 40.05,long: -71.12 }]

  constructor() {

  }

  ngOnInit() {

  }

  mouseOver( infoWindow) {
    infoWindow.open();
  }

  mouseOut(infoWindow) {
    infoWindow.close();
  }
}

app.component. html

<agm-map>
    <agm-marker *ngFor="let data of myData;let i = index" [latitude]="data.lat" [longitude]="data.long" (mouseOut)="mouseOut(infoWindow)" (mouseOver)="mouseOver(infoWindow)">
        <agm-info-window #infoWindow >  
            sample text {{i}}
        </agm-info-window>
    </agm-marker>
</agm-map>