谷歌地图缩放控制搞砸了
Dón*_*nal 172 javascript css google-maps
我使用Google Maps API(v.3)显示带有几个标记的地图.我最近注意到用于缩放地图的控件搞砸了(它并不总是这样).我不知道原因是什么.
更新
这篇文章最初有一个指向你可以查看问题的页面的链接,但现在链接已经被破坏,所以我删除了它.
Kon*_*nel 109
你的CSS搞砸了.max-width: 100%;在第814行中删除,缩放控件将再次显示正常.要避免此类错误,请在CSS中使用更具体的选择器.
- 修复它在bootstrap只是给你的地图div类google-maps (28认同)
- 如果您使用的是Twitter的Bootstrap,它们也是如此,它们有一个img {max-width:100%}会让人感到困惑.它应该在2.0.2分支中修复 (12认同)
Ali*_*ned 80
#myMap_canvas img {
max-width: none;
}
为我修好了,但我也想通过@Ben指出对问题的评论,"如果你使用is map_canvas作为map div id,这个问题不会发生在Bootstrap上".他是对的.我没有使用Bootstrap,但是在我更改div id之后问题就开始了.
将其设置回map_canvas会修复它,而不会更改最大宽度.
<div id="map_canvas"></div>
woe*_*ens 21
如果你正在使用Bootstrap,只需给它"google-maps"类.这对我有用.
作为替代方案,您可以重置谷歌地图div的所有内容,作为一种最后的解决方案:
HTML:
<div class="mappins-map"><div>
CSS:
.mappins-map img {
max-width: none !important;
height: auto !important;
background: none !important;
border: 0 !important;
margin: 0 !important;
padding: 0 !important;
}
poo*_*chi 16
刚刚分享@ Max-Favilli的回答:
使用最新版本的google maps api,您需要:
<style>
.gm-style img { max-width: none; }
.gm-style label { width: auto; display: inline; }
</style>
感谢@ Max-Favilli
如果您是Twitter Bootstrap用户,则应将此行添加到CSS中:
.gmnoprint img { max-width: none; }