使用选项卡时InfoWindow高度不正确

时间:2012-10-04 18:25:34

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

我正在使用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 打开 时,会根据内容自动计算InfoWindow的高度,而不是在DOM准备就绪时。结果是InfoWindow的大小大约是它应该的两倍,因为高度基本上是每个选项卡中所有内容的高度之和。渲染选项卡时,我在InfoWindow中留下了很多空格。

所以我需要做的是强制InfoWindow在 呈现标签后重新计算它的高度 。这可能吗?

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

1 个答案:

答案 0 :(得分:3)

我通过以下方式解决了这个问题:

  1. 使用'html:'属性
  2. 在标记对象中声明HTML内容
  3. 在设置实际内容之前创建空叠加
  4. 更新点击事件的叠加内容,然后将 tabberAutomatic 初始化
  5. 您可以在此处查看实时示例:

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

    对于多个标记:

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

    注意:

    1. 必须在循环外
    2. 创建空白叠加层。
    3. 没有需要在domready事件上运行 tabberAutomatic 功能。
    4. 最佳,