从谷歌地图信息窗口中删除关闭图标

remove close icon from the google map info window

本文关键字:删除 图标 窗口 谷歌地图 信息 信息窗      更新时间:2024-07-05

如何删除谷歌地图中信息窗口的关闭图标。我试图删除这个图标,但找不到id或类。

所以有人能帮我从信息窗口中删除关闭图标吗?

您可以使用CSS:隐藏关闭按钮

.gm-style-iw + div {display: none;}

这对我来说只适用于css

.gm-ui-hover-effect {
    display: none !important;
}

我尝试了上面的所有建议,但都失败了。我尝试使用jquery $('.gm-style-iw').next().hide(),但效果不太好。

这对我来说是有效的,以防有人需要。这就是我对GMAP API V3所做的。

.gm-style .gm-style-iw + div {
    display: none; /* <-- this will generally work on the fly. */
    visibility: hidden; /* this 2 lines below are just for hard hiding. :) */
    opacity: 0;
}

一般来说,它所做的是查找由API动态创建的gm-style-iw的直接同级。gm-style-iw旁边的div是关闭按钮。

希望能有所帮助。:)

button.gm-ui-hover-effect {
    visibility: hidden;
}

这在Chrome和Edge 中仍然有效

你可以试试这个

::ng-deep .gm-style .gm-style-iw-c button {
    display: none !important;
}

它的神奇之处在于::ng深度修饰符,它可以深入搜索样式并覆盖它们。

对于使用Google Maps API v2的用户,此功能将打开一个没有关闭图标的信息窗口:

openInfoWindowHtml(html, {
  maxWidth: 200, buttons: { close: { visible: false } }
});

我在选项对象上将closeBoxURL设置为空字符串

infoboxOptions = {
    closeBoxURL: '',
    ...
}
var infobox = new InfoBox(infoboxOptions);

你可以试试这个

.gm-style-iw + div{ display: none; } // hide div
.gm-style-iw + div + img{ display: none; } // hide img 
.gm-style-iw button>img {
    display: none!important;
}

这段代码将使它发挥作用。在我的案例中,表示关闭按钮的图像位于div类gm样式iw 中的按钮标签内

将其添加到您的CSS:中

button.gm-ui-hover-effect {
   visibility: hidden;
}

这与Maps API v3.43 完美配合