编程语言
首页 > 编程语言> > javascript-使用选项卡时,InfoWindow的高度不正确

javascript-使用选项卡时,InfoWindow的高度不正确

作者:互联网

我正在使用tabber.js将选项卡添加到我的InfoWindows中,并且使用以下代码来确保在InfoWindow的DOM准备就绪后呈现这些选项卡:

infowindow.id = marker.markerid;
infowindow.open(map, marker);

google.maps.event.addListener(infowindow, 'domready', function () {
    tabberAutomatic({div: document.getElementById(marker.markerid)});
});

使用Google Maps API,当InfoWindow打开时(而不是在DOM准备就绪时),InfoWindow的高度是根据其内容自动计算的.结果是,InfoWindow的大小大约是其应有大小的两倍,因为高度基本上是每个选项卡中所有内容的高度之和.呈现选项卡时,我在InfoWindow中留有很多空白.

因此,我需要做的是在渲染选项卡后强制InfoWindow重新计算其高度.这可能吗?

更新:This Fiddle说明了我的问题.在这种情况下,如何强制InfoWindow正确计算其高度?显式设置maxHeight或等效值不是一个选项,因为InfoWindow的内容是动态生成的.

解决方法:

我已经通过执行以下操作解决了该问题:

>使用’html:’属性在标记对象中声明HTML内容
>在设置实际内容之前创建了一个空叠加层
>更新了点击事件的叠加内容,并初始化了tabberAutomatic之后

您可以在此处看到实时示例:

http://jsfiddle.net/alexcastillo/af6bs/

对于多个标记:

http://jsfiddle.net/alexcastillo/Gk7AM/

笔记:

>必须在循环外部创建空的叠加层.
>不需要在domready事件上运行tabberAutomatic函数.

最好,

标签:google-maps,google-maps-api-3,css,html,javascript
来源: https://codeday.me/bug/20191127/2075086.html