谷歌地图信息框 - maxWidth

我面临谷歌地图信息框的怪异行为。我将maxWidth调整为0，以允许信息框大小调整为内容，但我总是得到一个236px的信息框。谷歌地图信息框 - maxWidth

var infobox = new InfoBox({ 
    maxWidth:0 
    ,pixelOffset: new google.maps.Size(5, 10) 
    ,isHidden:false 
    ,closeBoxURL:"" 
    ,pane: "floatPane" 
    ,enableEventPropagation: false 
    ,Zindex: null 
});

如果我调整css文件中的信息框宽度，如下图所示，我在每个信息框中获得相同的大小。

.infobox {width: 500px;}

我在做什么错了？任何意识如何解决这个问题？

来源

2012-06-16 user1460038

解决使用（white-space：nowrap;）在CSS文件。 – user1460038

也可以使用boxStyle对象在InfoBoxOptions

boxStyle: { 
     whiteSpace: "nowrap" 
}

来源

2013-01-31 08:53:12 DoubleYo

我遇到类似的问题，所以我检索到的最佳宽度和高度动态和然后相应地设置我的信息框的尺寸。这里是一个jQuery函数和应用程序的功能，应该解决这个问题。我觉得API在这方面真的很不起眼。

getInfoBoxDimensions: function(content) { 
    var sensor = $("<div>").html(content); 
    $(sensor).appendTo("body").css({"position" : "absolute", "left" : "-900px"}); 
    var width = $(sensor).width(); 
    var height = $(sensor).height(); 
    $(sensor).remove(); 
    return new Array(width, height); 
},

现在你可以抓住的高度和HTML内容的宽度与以下：

var infoBoxDimensions = getInfoBoxDimensions(info_box_html);

，并使用以下设置你的信息框：

var ib = new InfoBox({ 
    content : info_box_html, 
    boxStyle : { 
      width : infoBoxDimensions[0] + "px", 
      height : infoBoxDimensions[1] + "px" 
    }, 
    .... 
    .... 
});

你info_box_html应该有它的风格设置为“inline-block”。默认情况下，块元素会占用100％的宽度，我们只需要我们内容的确切宽度，而内联块会为我们做到这一点。

希望帮助你出来

来源

2013-02-05 16:56:09

将div附加到窗口只是为了获得宽度，然后删除是一个坏主意 – fridgerator

对于完整的html信息框，你有更好的方法吗？设置空白空间并不是一个解决方案 - 所有这些都需要更详细的内容，特别是带有图像，html和多行内容的内容。谷歌地图AFAIK必须通过宽度和高度，或自动设置它，这不是我们想要的。 –

不知道如何“正确”这个解决方案，但这里有云：

刚刚成立的谷歌信息框包装自动的宽度和高度，并添加重要的是防止谷歌JS从调整大小它：

.gm-style-iw { 
    width: auto !important; 
    height: auto !important; 
    div { 
     width: auto !important; 
     height: auto !important; 
    } 
}

来源

2015-01-16 07:19:19

谷歌地图信息框 - maxWidth

回答

相关问题