在使用 ngmap 加载的地图上显示信息 window
Show info window on map loaded with ngmap
我正在使用 ng-map 和打字稿。
这是我的模板:
<map on-tilesloaded="showInfoWindow('myInfoWindow')" center="{{model.adresseLatitude}}, {{model.adresseLongitude}}" zoom="15" style="height: 425px">
<marker id="gmapMarker" on-click="showInfoWindow('myInfoWindow')" position="{{model.adresseLatitude}}, {{model.adresseLongitude}}">
<info-window id="myInfoWindow">
<div ng-non-bindable="">
{{model.adresse}}
</div>
</info-window>
</marker>
</map>
加载地图后,信息窗口显示在地图的左上角,但单击标记后它工作正常。
我希望在显示地图时信息窗口在正确的位置(在标记上)打开。
您可以在 <info-window>
标记中使用 visible-on-marker="markerID"
而不是 map
指令中的 on-tilesloaded="showInfoWindow('myInfoWindow')"
。即:<info-window id="myInfoWindow" visible-on-marker="markerID">
喜欢:
<map center="{{model.adresseLatitude}}, {{model.adresseLongitude}}" zoom="15" style="height: 425px">
<marker id="gmapMarker" on-click="showInfoWindow('myInfoWindow')" position="{{model.adresseLatitude}}, {{model.adresseLongitude}}">
<info-window id="myInfoWindow" visible-on-marker="gmapMarker">
<div ng-non-bindable="">
{{model.adresse}}
</div>
</info-window>
</marker>
</map>
我正在使用 ng-map 和打字稿。 这是我的模板:
<map on-tilesloaded="showInfoWindow('myInfoWindow')" center="{{model.adresseLatitude}}, {{model.adresseLongitude}}" zoom="15" style="height: 425px">
<marker id="gmapMarker" on-click="showInfoWindow('myInfoWindow')" position="{{model.adresseLatitude}}, {{model.adresseLongitude}}">
<info-window id="myInfoWindow">
<div ng-non-bindable="">
{{model.adresse}}
</div>
</info-window>
</marker>
</map>
加载地图后,信息窗口显示在地图的左上角,但单击标记后它工作正常。
我希望在显示地图时信息窗口在正确的位置(在标记上)打开。
您可以在 <info-window>
标记中使用 visible-on-marker="markerID"
而不是 map
指令中的 on-tilesloaded="showInfoWindow('myInfoWindow')"
。即:<info-window id="myInfoWindow" visible-on-marker="markerID">
喜欢:
<map center="{{model.adresseLatitude}}, {{model.adresseLongitude}}" zoom="15" style="height: 425px">
<marker id="gmapMarker" on-click="showInfoWindow('myInfoWindow')" position="{{model.adresseLatitude}}, {{model.adresseLongitude}}">
<info-window id="myInfoWindow" visible-on-marker="gmapMarker">
<div ng-non-bindable="">
{{model.adresse}}
</div>
</info-window>
</marker>
</map>