谷歌地图的缩放控制出了问题

小开

最佳答案

你的 CSS 搞砸了。删除第814行中的 max-width: 100%;，缩放控件看起来就会恢复正常。为了避免这样的错误，在 CSS 中使用更具体的选择器。

小开

#myMap_canvas img {
max-width: none;
}

为我修复了这个问题，但是我还想指出@Ben 对这个问题的评论，“如果使用 is map _ Canvas map div id，Bootstrap 就不会出现这个问题”。他说得对。我没有使用 Bootstrap，但是在我更改了 div id 之后，问题就开始出现了。

将它设置回 map _ Canvas 修复了它，而没有更改最大宽度。

<div id="map_canvas"></div>

小开

如果你正在使用 Bootstrap，只要给它“谷歌地图”类。这对我很有用。

作为一种替代方案，你可以重置谷歌地图 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;
}

小开

如果你正在使用雅虎的纯 CSS，给你的 div 一个像 Bootstrap 一样的“ google-map”类，然后把这个规则放到你的 CSS 中:

.google-maps img {
max-width: none;
max-height: none;
}

据我所知，纯 CSS 没有办法自己解决这个问题。

小开

你们告诉我的那些选择对我的网站不起作用。

我使用 Bootstrap V3，并着重介绍其功能。主要原因是我给我的地图一个不同的 ID，然后 CSS 文件用来显示黄色街景的家伙缩放条

我重命名了 map _ Canvas 为 mapholder，然后它就对我起作用了！无论如何感谢的提示，我应该查看 CSS 文件！

小开

如果你是一个 Bootstrap 用户，你应该在你的 CSS 中添加这一行:

.gmnoprint img { max-width: none; }

小开

我也有这个问题

.google-maps img {
max-width: none;
}

没用，我最后用了

.google-maps img {
max-width: none !important;
}

而且非常有效。

小开

分享@Max-Favilli 回答:

随着最新版本的谷歌地图应用程序接口，你需要这样:

<style>
.gm-style img { max-width: none; }
.gm-style label { width: auto; display: inline; }
</style>

感谢@Max-Favilli

Https://stackoverflow.com/a/19339767/3070027

小开

我尝试了以上所有的解决方案，以及其他论坛的其他解决方案，但都无济于事。这真的很烦人，因为我有另一个非 WordPress 网站的代码工作得很完美。(我试图在 Wordpress 页面中显示谷歌地图，但缩放和 Streetview 控件失真)。

我所做的解决方案是创建一个新的 html 文件(将所有代码复制到 Notepad 并将其命名为 xyz.html，另存为“ all files”类型)。然后上传/ftp 到网站，设置一个新的 Wordpress 页面，并使用嵌入功能。编辑页面时，转到文本编辑器(而不是可视化编辑器)并复制/输入:

网址宽度 = “900”高度 = “950”>

如果您更改了维度，请记住在上面的两个参数中都更改它，否则会得到奇怪的结果。

就是这样——可能没有其他答案那么聪明，但对我来说很有用！证据在这里: http://a-bc.co.uk/latitude-longitude-finder/

谷歌地图的缩放控制出了问题

更新