0

该页面使用 Google 地图加载，并且最初不会填充它周围的容器。半秒后，谷歌地图填满了容器。

问题是在容器正确填充后它会变形。由于移位的经度线显示其中两个彼此相邻。并且地图控件也被扭曲了。甚至不能告诉缩放栏在那里。

任何帮助是极大的赞赏！

这是我刚开始构建的 Wordpress 插件的一部分。

我还不能发布图片，否则我会！

4

3 回答 3

2

问题出在 wordpress 使用的默认主题中。下面的代码行概述了它只允许它达到弄乱谷歌地图所需的宽度的 97.5%。

.entry-content img, .comment-content img, .widget img { max-width: 97.5%; }

正确的代码（或对我有用的代码）：

.entry-content img, .comment-content img, .widget img { max-width: none; }

于 2012-06-08T20:16:42.717 回答
0

我以前经历过这个问题几次，而不是使用 wordpress，因为我从那个包中避开了。但是我有两个原因......

只有在每次查看/加载地图后才会发生一次，这是由于 gmaps 外部脚本调用被加载不止一次。

第二个是由于影响地图块元素的相对/绝对位置元素......我无法回忆起 100% 自那以后的几周......

你如何处理 onload 事件等等......

于 2012-06-05T20:49:18.847 回答
0

我决定写一个答案来帮助其他有同样问题的人。

我最近偶然发现了这个问题，并且遇到了同样的问题以及其他问题。谷歌地图缩放栏不可见，每张图片都有一个漂亮的灰色边框:) 所有问题都是因为第 23 个主题中的默认样式：

/* Responsive images */
.entry-content img,
.comment-content img,
.widget img {
    max-width: 100%; /* Fluid images for posts, comments, and widgets */
}

和更低

.entry-content img,
.comment-content img,
.widget img,
img.header-image,
.author-avatar img,
img.wp-post-image {
    /* Add fancy borders to all WordPress-added images but not things like badges and icons and the like */
    border-radius: 3px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
}

我将我的 google-map 对象放在 id = map_canvas 的 div 中。解决方案是在我的样式中添加上述样式的覆盖：

 #map-canvas img {
     max-width: none!important;
    border-radius: none!important;
    box-shadow: none!important;
 }

瞧！地图很干净:)

于 2013-12-20T15:42:36.713 回答