在使用ngmap加载的地图上显示信息窗口

时间:2016-02-09 10:02:43

标签: javascript angularjs google-maps typescript ng-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>

加载地图时,infoWindow显示在地图的左上角,但单击标记时效果正常。

我希望在显示地图时,infowindow在正确的位置(在标记上)打开。

1 个答案:

答案 0 :(得分:2)

您可以在on-tilesloaded="showInfoWindow('myInfoWindow')"代码中使用map,而不是visible-on-marker="markerID"指令中的<info-window>。即:<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>