为什么 CSS 样式会扭曲我的 Google 地图缩放？

【问题标题】：Why does CSS styling distort my Google maps zooming?为什么 CSS 样式会扭曲我的 Google 地图缩放？
【发布时间】：2015-06-11 02:50:53
【问题描述】：

这是一个工作版本

这是一个带有 Bootstrap 样式的损坏版本（缩放小部件不再正确显示）

为什么会坏掉？

【问题讨论】：

【解决方案1】：

您也可以为个别地图修复此问题，例如：

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

【讨论】：

【解决方案2】：

在 Bootstrap.css 第 69 行 max-width: 100%; 导致问题。

img {
max-width: 100%; <--
vertical-align: middle;
border: 0;
-ms-interpolation-mode: bicubic;
}

您可以删除它，如果需要再次指定一个新类 .newclass {max-width:100%} 并将其添加到图像中。

【讨论】：

【解决方案3】：

我修复了这里列出的内容略有不同。

.gm-style img {
    max-width: none;
}

【讨论】：

【解决方案4】：

无需指定新的类，只需复制此代码即可

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

【讨论】：