当您单击我的Google Maps v3上的主页图标时，我的InfoWindow似乎没有正确调整到InfoWindow内容的大小。
它在不应该时提供滚动条。InfoWindow应该正确地自动调整大小。
有什么想法吗？
根据请求，相关的JavaScript会为InfoWindow注入HTML：
listing = '<div>Content goes here</div>';
更新
此错误已由有问题的Google处理
https://issuetracker.google.com/issues/35823659
该修复程序于2015年2月在Maps JavaScript API的3.19版中实现。
Answers:
在您的信息窗口中添加一个div
<div id=\"mydiv\">YourContent</div>
然后使用css设置大小。为我工作。假设所有信息窗口大小相同！
#mydiv{
width:500px;
height:100px;
}
<div class=\"mydiv\">YourContent</div>和.mydiv{ width:500px; height:100px; }
简短的答案：在构造函数中设置maxWidth options属性。是的，即使您不希望设置最大宽度。
更长的故事：将v2映射迁移到v3，我确切地看到了描述的问题。窗口的宽度和高度各不相同，有些具有垂直滚动条，有些则没有。有些已嵌入<br />数据中，但至少有一个大小合适。
我不认为InfoWindowsOptions.maxWidth属性是相关的，因为我不在乎限制宽度...但是通过使用InfoWindow构造函数设置宽度，我得到了想要的，并且窗口现在自动（垂直）调整大小，并且在没有垂直滚动条的情况下显示全部内容。对我来说没有多大意义，但确实有效！
maxWidth为百分比，则Google地图会将浮动{"maxWidth":0.25}元素识别为父元素的百分比，然后将其转换为等效像素：define ，父元素的宽度为1000px，InfoWindow将具有width: 250px。我认为无法强制InfoWindow的宽度保持一定百分比（的值maxWidth必须为数字，因此{"maxWidth":"25%"}将不起作用，并且{"maxWidth":25%}将其视为25模数未定义并触发语法错误）。
您应该将内容从jQuery对象提供给InfoWindow。
var $infoWindowContent = $("<div class='infowin-content'>Content goes here</div>");
var infoWindow = new google.maps.InfoWindow();
infowindow.setContent($infoWindowContent[0]);
overflow: auto当您传入DOM节点而不是字符串时，maps API似乎没有放在InfoWindow DIV上。如果内容仅超出1-2px，则可以解决此问题。不幸的是，这意味着更长的内容实际上悬挂在InfoWindow之外，而不是添加滚动条。
infoWindow's显示正确，这很讨厌。我的答案中列出了有关此方法工作原理的完整答案-jQuery创建一个独立的DOM树，该树迫使内容正确呈现，并且大小正确确定，然后Google尝试将其放置infoWindow在地图上
.gm-style-iw{
height: 100% !important;
overflow: hidden !important;
}
这个对我有用
编辑（突出）：请相信我，在这个问题的其他一百个答案中，这是唯一可以解释为什么会发生的正确答案
好的，所以我知道这个线程很旧，并且有1000个答案，但是没有一个是正确的，我觉得需要发布正确的答案。
首先，你不会永远需要指定width's或height's在为了让您的信息窗口，以显示没有滚动任何东西，虽然有时候你可能会意外地得到它做这个工作（但它最终会失败）。
其次，Google Maps APIinfoWindow's 没有滚动错误，很难找到有关其工作方式的正确信息。好吧，这里是：
当您像这样告诉Google Maps API在infoWindow中打开时：
var infoWindow = new google.maps.InfoWindow({...});
....
infoWindow.setContent('<h1>Hello!</h1><p>And welcome to my infoWindow!</p>');
infoWindow.open(map);
出于所有意图和目的，google maps会在您的HTML内容中暂时将adiv放置在页面的末尾（实际上，它会创建一个detached DOM tree-，但如果从概念上讲，如果您想象某个div存在于页面的末尾，那么从概念上更容易理解）指定。然后，它的措施该分区（这意味着，在这个例子中，无论我的文档中的CSS规则适用于h1和p标签将被应用到它）来获得它的width和height。然后，Google接受div，将其添加到页面后得到的尺寸分配给它，然后将其放置在地图上您指定的位置。
这是很多人发生问题的地方-他们可能有如下所示的HTML：
<body>
<div id="map-canvas"><!-- google map goes here --></div>
</body>
以及出于任何原因的CSS如下所示：
h1 { font-size: 18px; }
#map-canvas h1 { font-size: 32px; }
你看到问题了吗？当API试图进行测量您infoWindow（立即显示它之前），该h1部分内容将有一个大小18px（因为临时“测量格”被附加到体），但是当API实际上是放置infoWindow在在地图上，#map-canvas h1选择器将优先处理，导致字体大小与API测量大小时的字体大小有很大不同infoWindow，在这种情况下，您将始终获得滚动条。
由于您的中有滚动条的特定原因，细微差别可能会稍有不同infoWindow，但是其背后的原因是：
infoWindow无论实际HTML元素在标记中的位置如何，都必须对您内部的内容应用相同的CSS规则。如果没有，那么您将保证在infoWindow中获得滚动条。
所以我经常做的是这样的：
infoWindow.setContent('<div class="info-window-content">...your content here...</div>');
在我的CSS中：
.info-window-content { ... }
.info-window-content h1 { .... }
.info-window-content p { ... }
etc...
因此，无论API在何处附加测量值div-在关闭之前body或内部#map-canvas，应用于它的CSS规则都将始终相同。
编辑RE：字体家族
Google似乎正在积极处理字体加载问题（如下所述），并且功能最近已经改变，因此infoWindow，根据您使用的API版本，您第一次打开时可能看不到Roboto字体加载。有一个开放的错误报告（即使在更改日志中此错误报告已被标记为已修复），它表明google仍然难以解决此问题。
一件事：观看您的字体家庭！！！
在API的最新版本中，Google试图变得聪明，并将其infoWindow内容包装在可以使用CSS选择器-定位的内容中.gm-style-iw。对于不了解我上面解释的规则的人，这并没有真正的帮助，在某些情况下甚至更糟。滚动条几乎总是在第一次infoWindow打开时出现，但是如果infoWindow再次打开，即使内容完全相同，滚动条也会消失。严重的是，如果您不感到困惑，这会让您迷失方向。这是正在发生的事情：
如果您查看Google在加载API时在网页上加载的样式，您将能够看到以下内容：
.gm-style {
font-family: Roboto,Arial,sans-serif
...
}
好的，因此Google希望通过始终使它们使用Roboto字体家族来使其地图更加一致。问题是，对于大多数人来说，在打开之前infoWindow，浏览器尚未下载Roboto字体（因为页面上没有其他字体使用过该字体，因此浏览器足够聪明，知道不需要下载该字体）。此字体）。尽管下载速度非常快，但并不是立即下载的。第一次打开时infoWindow，API将内容div随infoWindow内容附加到正文以进行测量，它开始下载Roboto字体，但是infoWindow's在Roboto完成下载之前，将进行测量并在地图上放置窗口。结果经常是infoWindow在使用内容Arial或sans-serif字体呈现内容时进行了测量，但是在地图上显示（并Roboto完成下载）时，内容以不同大小的字体显示-瞧-滚动条第一次出现你打开infoWindow。infoWindow再次完全相同地打开-此时Roboto已下载该文件，并且将在API对其infoWindow内容进行度量时使用，并且您不会看到任何滚动条。
我尝试了列出的每个答案。没有人为我工作。这终于永久修复了它。我继承的代码DIV在所有<h#>和<p>条目周围都有包装。考虑到所需的最大宽度，我只是在同一个DIV中强加了一些“样式”，为了防止万一（别人的修正）和我自己的改变了行高的变化white-space: nowrap，然后使自动溢出进行了正确的调整。没有滚动条，没有截断，没有问题！
html = '<div class="map-overlay" style="max-width: 400px;
line-height: normal;
white-space: nowrap;
overflow: auto;
">';
white-space: nowrap具有魔力的-其他样式是不必要的。干杯!
font-family: sans-serif !important; font-weight: normal !important;。
我知道这是一个旧线程，但是我遇到了同样的问题。我在InfoWindow中有<h2>和<p>元素，而这两个元素都有底边距。我删除了页边距，并且InfoWindow的大小正确。其他建议的修复均无效。我怀疑InfoWindow的大小计算没有考虑到边距。
<div style='overflow:hidden;'></div>看起来不错”中。
要将我的答案添加到列表中，因为这些都没有解决我的问题。我最终将内容包装在div中，给该div一个类，并min-width在div上指定，maxWidth并在infoWindow上指定，并且它们都必须具有相同的大小，否则宽度或高度都会溢出在内容量错误的盒子上。
Javascript：
// Set up the content for the info box
var content = "<div class='infowindow-content'>" + content + "</div>";
// create a map info box
var infoWindow = new google.maps.InfoWindow({
maxWidth: 350,
content: content
});
CSS：
div.infowindow-content {
min-width: 350px;
}
min-width在内容上设置一个也是对我唯一有效的方法。不必maxWidth在infoWindow上设置。
我已经尝试了所有这些解决方案，但均无效果。经过一番反复尝试后，我发现了。
<style type="text/css">
#map_canvas {
line-height:normal;
}
</style>
为地图画布div设置line-height：normal。
#map_canvas我看不到Google Maps v3中的任何内容。这必须来自旧的v2。
#map_canvas是您用于地图的div。它可以是您想要的任何名称。
看来问题出在Roboto网络字体上。
根据提供的内容，使用内置的width和height属性来渲染信息窗口。但是，它不是使用已经渲染/加载的webfont来计算的。在将整个地图打印到屏幕之后呈现字体之后，由于窗口DIV中内联的“ overflow：auto”属性，滚动条将出现。
我发现可以使用的解决方案是将内容包装在DIV中，然后应用CSS覆盖webfont：
.gmap_infowin {
font-family: sans-serif !important;
font-weight: normal !important;
}
<div class="gmap_infowin">Your info window content here.</div>
有趣的是，下面的代码将更正WIDTH滚动条：
.gm-style-iw
{
overflow: hidden !important;
line-height: 1.35;
}
它用来纠正HEIGHT滚动条：
.gm-style-iw div
{
overflow: hidden !important;
}
编辑： 添加空格：nowrap; 两种样式都可以纠正删除滚动条时似乎仍然存在的间距问题。内森很棒。
这对我有用。把一个div在setContent
sh_map.infoWindow.setContent([
'<div id=\"mydiv\">',
'Your content goes here',
].join(''));
然后将此CSS添加到您的页面：
<style type="text/css">
#map-canvas {
text-align: center;
vertical-align: middle;
}
#mydiv {
font-family: "Comic Sans MS", cursive;
font-size: 10px;
border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 0px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
letter-spacing: normal;
text-align: center;
vertical-align: middle;
word-spacing: normal;
}
</style>
例如，请参见http://www.student-homes-northampton.co.uk；点击房屋图片下的链接以显示Google地图。
我在IE中遇到同样的问题，并尝试了这些响应中详细介绍的许多修复程序，但无法可靠地删除IE中的垂直滚动条。
对我来说最有效的方法是在信息窗口中切换为固定的字体大小-'px'...我正在使用ems。通过固定字体大小，我不再需要显式声明信息窗口的宽度或高度，并且滚动条已经一去不复返了。
如果没有其他问题，请在打开窗口后尝试添加内容。这将迫使其调整大小。
infoWindow = new google.maps.InfoWindow()
infoWindow.open(map, marker)
infoWindow.setContent(content)
使用domready事件并重新打开信息窗口，并在domready事件触发两次后显示隐藏的内容，以确保所有dom元素均已加载。
// map is created using google.maps.Map()
// marker is created using google.maps.Marker()
// set the css for the content div .infowin-content { visibility: hidden; }
infowindow = new google.maps.InfoWindow();
infowindow.setContent("<div class='infowin-content'>Content goes here</div>");
infowindow.setPosition(marker.getPosition());
infowindow.set("isdomready", false);
infowindow.open(map);
// On Dom Ready
google.maps.event.addListener(infowindow, 'domready', function () {
if (infowindow.get("isdomready")) {
// show the infowindow by setting css
jQuery('.infowin-content').css('visibility', 'visible');
}
else {
// trigger a domready event again.
google.maps.event.trigger(infowindow, 'content_changed');
infowindow.set("isdomready", true);
}
}
我尝试仅执行setTimeout（/ * show infowin callback * /，100），但是有时如果内容（即图像）加载时间太长，则仍然无法正常工作。
希望这对您有用。
//infowindow.setContent(response);
var infowindowopts = {
maxWidth: 274,
content: response
};
infowindow.setOptions(infowindowopts);
min-height向您的infoWindow类元素添加一个。
如果您的infoWindows大小均相同，则可以解决此问题。
如果没有，请将这行jQuery添加到infoWindow的click函数中：
//remove overflow scrollbars
$('#myDiv').parent().css('overflow','');
我的答案是添加一个侦听器（使用addListenerOnce）以检查是否已将infoWindow添加到DOM中，然后再次打开infoWindow（无需关闭它）。
// map, marker and infoWindow code, we'll call them
// myMap, myMarker and myInfoWindow
myInfoWindow.open(myMap, myMarker);
google.maps.event.addListenerOnce(myInfoWindow, 'domready', function(){
myInfoWindow.open(myMap, myMarker);
});
为了总结适用于所有浏览器的所有解决方案：
设置信息窗口的最大宽度：
this.infowindow = new google.maps.InfoWindow({
maxWidth: 200
});
将信息窗口的内容包装为
<div style="overflow:hidden;line-height:1.35;min-width:200px;">*CONTENT*</div>
（将最小宽度更改为在信息窗口maxWidth上设置的值）
我已经对其进行了测试，并且可以在每种浏览器上使用，并且我拥有400多个标记...
我知道很多其他人都找到了适合他们特定情况的解决方案，但是由于他们中没有一个人适合我的特定情况，因此我认为这可能对其他人有所帮助。
一些细节：
我在一个项目中使用了Google Maps API v3，但我们确实希望避免使用内联CSS。我的信息窗口可用于除IE11（宽度未正确计算）以外的所有内容。这导致div溢出，从而触发滚动条。
我必须做三件事：
从信息窗口内容中的所有内容中删除所有显示：内联块样式规则（我已替换为显示：块）-我想到了从有人遇到相同问题的线程（我再也找不到了）中尝试此操作的想法IE6的问题。
将内容作为DOM节点而不是字符串传递。我正在使用jQuery，因此可以通过替换来实现：infowindow.setContent(infoWindowDiv.html());用，infowindow.setContent($(infoWindowDiv.html())[0]);
这对我来说最简单，但是还有很多其他方法可以得到相同的结果。
使用“ setMaxWidth”技巧-在构造函数中设置MaxWidth选项-稍后设置该选项无效。如果您真的不想要最大宽度，只需将其设置为很大的数字即可。
我不知道为什么它们起作用，并且我不确定它们的一部分是否可以起作用。我知道它们都不适用于我的所有用例，并且2 + 3不起作用。我没有时间测试1 + 2或1 + 3。
硬编码信息窗口的宽度和高度，或者设置white-space: nowrap，该maxWidth解决方案并没有帮助我，其他一切都不起作用或不适合我的用例，这对我来说是不可接受的。
我的解决方案是设置内容，打开窗口，然后在domready触发事件时，将内容的heightCSS属性设置为任意高度，然后强制Google Maps相应地调整InfoWindow的大小。
infoWindow是InfoWindow对象，$infoWindowContents是我要放入其中的内容的Jquery对象，map是我的Map对象。marker是被点击的标记。
infoWindow.setContent($infoWindowContents.get(0));
var listener = google.maps.event.addListener(infoWindow, 'domready', function() {
// Stop listening, otherwise the listeners stack up if the window is opened again
google.maps.event.removeListener(listener);
// Set the height on the container to however tall the browser is currently rendering it
$infoWindowContents.height($infoWindowContents.height());
// Force Google Maps to recalculate the InfoWindow height
infoWindow.setContent($infoWindowContents.get(0));
});
infoWindow.open(map, marker);
（我在一个类似的问题上发布了相同的解决方案，如何获得一个google-maps InfoWindow来调整其大小以适合放置在其中的内容？）
在浪费时间并阅读了一段时间之后，我只想要一些简单的东西，这可以满足我的要求。
.gm-style-iw > div { overflow: hidden !important; }
这也不是一种即时解决方案，但是如果对问题加注星标/发表评论，可能会使他们解决该问题，因为他们认为该问题已得到解决：http : //code.google.com/p/gmaps-api-issues/issues/detail?id= 5713