如何在谷歌地图V3中制作信息窗口的圆角？答案

【问题标题】：how to make round corners of infowindow in the V3 of Google Map?如何在谷歌地图V3中制作信息窗口的圆角？
【发布时间】：2012-08-16 14:18:14
【问题描述】：

我目前正在使用 Google Map 的 API V3 创建具有多个标记的地图。单击标记会触发信息窗口的显示，描述后者的详细信息。

我需要知道如何像在 Google Map 的 API V2 中那样使 InfoWindow 的角变成圆形？

【问题讨论】：

查看这个答案stackoverflow.com/questions/3860277/…

标签： javascript google-maps google-maps-api-3

【解决方案1】：

infobubble 可让您创建自定义信息窗口并（几乎）按您喜欢的方式配置它们。

【讨论】：

我尝试了 infoBubble 解决方案，它在 FireFox 上运行，但在 IE 中它不起作用！这是我基于的代码的简单示例。谢谢你告诉我我需要在这段代码中添加什么
应该有链接吗？也许编辑您的问题以包含它。

【解决方案2】：

您无法自定义现有 InfoWindow 的 css，但您可以将其替换为更可自定义的内容。我喜欢 InfoBox，因为它与常规 InfoWINdow 非常相似，但具有更多样式选项。 InfoBox 实际上是 geocodezip 链接到的同一个 Google Maps Utility Library 的一部分。我建议同时下载两者，看看哪一个最适合您的需求。

google-maps-utility-library-v3

【讨论】：

【解决方案3】：

我用这段代码作为一个肮脏的黑客来实现这一点：

google.maps.event.addListener(this._w, 'domready', function () {
$('#map .bubbleContent')
    .parent().parent().parent().prev()
    .css('borderRadius', 5);
});

这段代码使用jQuery（也可以用纯JS做宽度）。选择器#map .bubbleContent 找到我放入infoWindow 的HTML 内容的包装div。 #map 是我的地图容器，只是为了确保不要从地图中选择任何 div。

注意！ 每当 Google 更改信息窗口的标记时，此代码可能会中断。

【讨论】：