在Google Maps API中为现有标记添加infowindow

时间:2015-04-20 00:09:55

标签: javascript google-maps google-maps-api-3

我正在使用javascript中的Google Maps API。我能够找到从一个点到另一个点的路线。但是,我需要编辑为位置上的标记显示的信息窗口。显示的默认信息显示地点的名称,有没有办法更改该信息以显示其他内容?

1 个答案:

答案 0 :(得分:2)

是的,您可以使用信息窗口执行各种操作:

请参阅https://developers.google.com/maps/documentation/javascript/examples/infowindow-simple以供参考。

infowindow中某些自定义html的示例:

var infoWindowContent = '<div id="map-player-info-content">' +
    '<img class="player-pic" ng-src="' + (playerList[i].profilePic || 'img/smash-app-icon.png') + '">' +
    '<p><span class="text-bold">Player:</span> ' + playerList[i].tag + '</p>' +
    '<p><span class="text-bold">Game(s):</span> ' + playerList[i].games + '</p>' +
    '<p><span class="text-bold">Main(s):</span> ' + playerList[i].mains + '</p>' +
    '</div>';

var infowindow = new google.maps.InfoWindow({
    content: infoWindowContent
});

var marker = new google.maps.Marker({
    position: myLatlng,
    map: map,
    title: 'Uluru (Ayers Rock)'
});

google.maps.event.addListener(marker, 'click', function () {
    infowindow.open(map, marker);
});