AGM 地图在单击或悬停到标记时显示完整地址答案

【问题标题】：AGM map display full address on click or hover to markerAGM 地图在单击或悬停到标记时显示完整地址
【发布时间】：2018-07-02 02:09:07
【问题描述】：

我使用纬度和经度在 AGM 地图上显示了多个标记。我想在每个标记上显示完整地址。谁能帮我在点击或悬停到每个标记时显示完整地址？

我使用下面的例子来使用 Angular 显示地图。

https://stackblitz.com/edit/angular-google-maps-demo?file=app%2Fapp.component.html

【问题讨论】：

使用任何 Google API 根据纬度和经度获取地址是否能够实现完整的地址行为？

标签： javascript jquery angular google-maps

【解决方案1】：

Here is my solution for the normal InfoWindow, but it should work with SnazzyWindow as well:

**.html**

<agm-map>
  <agm-marker *ngFor="let marker of markers" 
    (markerClick)="openWindow(marker.id)" 
    [latitude]="marker.lat" 
    [longitude]="marker.lng">
    <agm-info-window 
      [isOpen]="isInfoWindowOpen(marker.id)"
      [latitude]="marker.lat" 
      [longitude]="marker.lng">InfoWindow #{{marker.id}}</agm-info-window>
  </agm-marker>
</agm-map>

<button type="button" (click)="openWindow(5)">Open InfoWindow 5</button>

**.ts**

openedWindow : number = 0; // alternative: array of numbers

openWindow(id) {
    this.openedWindow = id; // alternative: push to array of numbers
}

isInfoWindowOpen(id) {
    return this.openedWindow == id; // alternative: check if id is in array
}


Make sure you added the latitude and longitude attributes to <agm-marker> and <agm-info-window>. Otherwise the <agm-info-window> position would differ from the marker, when you open it by the button.

If you want to have multiple info windows open at the same time, have a look at the comments above, starting with alternative:.

You may need to add more attributes to make it work. The code is limited to explain the basic functionality.

【讨论】：