要在 Google Maps 2 中使用 openInfoWindowHtml 函数,您需要遵循以下步骤:
请确保将 YOUR_API_KEY
替换为您的 Google Maps API 密钥。
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 14,
center: { lat: 40.730610, lng: -73.935242 }
});
var marker = new google.maps.Marker({
position: { lat: 40.730610, lng: -73.935242 },
map: map
});
openInfoWindowHtml
函数在标记上显示自定义 HTML 内容:var infoWindowContent = '<div style="color: red; font-size: 24px;">Hello, World!</div>';
function openInfoWindowHtml(marker, content) {
var infoWindow = new google.maps.InfoWindow({
content: content
});
google.maps.event.addListener(marker, 'click', function() {
infoWindow.open(map, marker);
});
}
openInfoWindowHtml(marker, infoWindowContent);
现在,当您点击标记时,将显示包含自定义 HTML 内容的信息窗口。
请注意,openInfoWindowHtml
函数是 Google Maps API 的一部分,因此您不需要额外安装或引用任何库。
推荐的腾讯云相关产品:
这些产品可以与 Google Maps API 结合使用,以提供更全面的地图应用开发体验。
领取专属 10元无门槛券
手把手带您无忧上云