1

我正在尝试使用名为InfoBubble的 Google Maps API v3 的自定义信息窗口实现。当我在本地进行开发时，Safari 将气泡渲染得很好。但是，当我将其上传到实时服务器时，它不再正确计算气泡内容的高度并显示滚动条（我不想要）（请参阅http://luketilley.com/maps/）。

我做了一些调查，看起来问题来自这段代码：

InfoBubble.prototype.getElementSize_ = function(element, opt_maxWidth,
                                            opt_maxHeight) {
var sizer = document.createElement('DIV');
sizer.style['display'] = 'inline';
sizer.style['position'] = 'absolute';
sizer.style['visibility'] = 'hidden';


if (typeof element == 'string') {
  sizer.innerHTML = element;
} else {
  sizer.appendChild(element.cloneNode(true));
}

document.body.appendChild(sizer);
var size = new google.maps.Size(sizer.offsetWidth, sizer.offsetHeight);

// If the width is bigger than the max width then set the width and size again
if (opt_maxWidth && size.width > opt_maxWidth) {
  sizer.style['width'] = this.px(opt_maxWidth);
  size = new google.maps.Size(sizer.offsetWidth, sizer.offsetHeight);
}

// If the height is bigger than the max height then set the height and size
// again
if (opt_maxHeight && size.height > opt_maxHeight) {
  sizer.style['height'] = this.px(opt_maxHeight);
  size = new google.maps.Size(sizer.offsetWidth, sizer.offsetHeight);
}

document.body.removeChild(sizer);
delete sizer;
return size;
};

具体来说，这一行：

var size = new google.maps.Size(sizer.offsetWidth, sizer.offsetHeight);

在调查 safari 报告的值后，我确认 safari 在本地和在线显示页面时确实报告了不同的值。

进行更多测试后，我还发现问题仅在我将图像添加到信息气泡时才开始（检查非洲海岸外的标记）。

这是我试图放入 info_bubble 的内容

info_content = '<div class="bubble">' +
                            '<h1>' + markerData.name + '</h1>' +
                            '<div class="icons">' +
                            icon_html +
                            '</div>' +
                            '<img src="' + markerData.image + '"/>' +
                            '<p>' + markerData.description + '</p>' +
                            '<p><a target="_blank" href="' + markerData.url + '"><img src="learn_more.png"/></a></p>' +
                        '</div>';

关于这里发生了什么的任何想法？有没有更好的方法来计算所需的大小？

更新：这可能是 Safari 的一个错误。我只是在调试器中花了一些时间，如果我设置断点并手动单步执行函数，它会做正确的事情，但如果我让它运行，它会继续行为不端。所以我想现在的问题是：有解决方法吗？

4

0 回答 0