谷歌地图信息窗口高度问题

发布于 2024-08-13 04:06:53 字数 489 浏览 6 评论 0原文

我一直在网上寻找解决方案。

我的问题是信息窗口的高度计算不正确。那里没有图像,因此稍后加载图像不会出现问题,并且创建气泡时不知道大小。

另外,如果我用大约 15 行以上的文本填充它,大小就会开始变得正常。

这是我提供给 infoWindowHtml 的内容:

<div><h2><a href="">Some title</a></h2><dl><dt>Location:</dt><dd>london</dd><dt>Description</dt><dd><p>Example text </p></dd></dl><p><a href="">Read more...</a></p></div>

I've been searching the net for a solution.

My problem is that the info window's height is not calculated properly. There are no images in there so it is not an issue with the image loading later and the size is not known when the bubble is created.

Also if I fill it up with about 15 lines more text the size is starting to get alright.

This is what I feed to infoWindowHtml:

<div><h2><a href="">Some title</a></h2><dl><dt>Location:</dt><dd>london</dd><dt>Description</dt><dd><p>Example text </p></dd></dl><p><a href="">Read more...</a></p></div>

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

淡写薰衣草的香 2024-08-20 04:06:53

为了解决这个问题,你可以设置主div的宽度和高度。
如果只设置宽度,它就会起作用。如果您设置宽度、高度和溢出:自动,则在内容太长的情况下您还会得到一个滚动条。

不过,在 Google 地图 V3 中,这个问题已得到解决。

To solve this problem you can set width and height of the main div.
If you set only the width, it will work. If you set width, height, and overflow:auto, you'll get also a scrollbar in case of a too long content.

However in Google Maps V3 this issue is solved.

二手情话 2024-08-20 04:06:53

我遇到了同样的问题,但我发现我遇到了这个问题,因为我在CSS中将填充设置为.contInfoBubble,而不是在选项参数中设置。
因此,我从 CSS 中删除了填充,并在 html 中创建气泡时将其设置在参数中(不是 .js,而是 map.html),这样:

[...]
var ib = new InfoBubble({
   //minHeight: 125,
   minWidth: 220,
   padding: 7,
   borderColor: "#dedede",
   borderRadius: 3,
   pixelOffset: new google.maps.Size(-140, -110),
});
[...]

我解决了问题。也许对你也是如此。

I had the same problem but i discovered that i had this problem because i set padding to the .contInfoBubble in the CSS, and don´t in the option parameter.
So, i remove the padding from the CSS and i set it in the parameter when i create the bubble in the html (not the .js yet but map.html), this way:

[...]
var ib = new InfoBubble({
   //minHeight: 125,
   minWidth: 220,
   padding: 7,
   borderColor: "#dedede",
   borderRadius: 3,
   pixelOffset: new google.maps.Size(-140, -110),
});
[...]

And i solved the problem. Maybe to you too.

我是男神闪亮亮 2024-08-20 04:06:53

min-height 添加到您的 infoWindow 类元素。

如果您的 infoWindows 大小相同,这将解决该问题。

如果没有,请将这行 jQuery 添加到 infoWindow 的单击函数中:

//remove overflow scrollbars
$('#myDiv').parent().css('overflow','');

Add a min-height to your infoWindow class element.

That will resolve the issue if your infoWindows are all the same size.

If not, add this line of jQuery to your click function for the infoWindow:

//remove overflow scrollbars
$('#myDiv').parent().css('overflow','');
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文