谷歌地图在隐藏的 div 中显示为灰色答案

【问题标题】：Google maps shows up grey in hidden div谷歌地图在隐藏的 div 中显示为灰色
【发布时间】：2012-11-09 04:42:08
【问题描述】：

我已阅读堆栈上有关此问题的许多线程，但没有任何内容可以解决我的问题。我在页面加载时最初隐藏的选项卡上有谷歌地图，希望得到一些帮助。完整代码如下：

<script type="text/javascript"> 
  function loadsinglemap(){
  var mymap = new MeOnTheMap({
  container: "map_sidebar2",
  html: "<?php echo str_replace('"',"",$post->post_title); ?>",
  address: "<?php echo str_replace('"','',get_post_meta($post->ID, "map_location", true)); ?>",
  zoomLevel: 15,

  });                        
  } 

 jQuery(document).ready(function() {   loadsinglemap();  })

 </script>

This is on the page where the map is displayed:

<script type="text/javascript">
$(document).ready(function(){
$('a.contact').click(function(){
google.maps.event.trigger(mymap, 'resize');
});
});
</script>

我只是无法让它工作。如果有人看到有帮助的东西，请回复。谢谢

编辑： 将元素选择器更改为一个类，并将我的链接更改为一个类而不是一个 ID，现在它至少可以选择它。我在 firebug 中收到“未定义 mymap”的错误。

【问题讨论】：

请给我们一个指向您页面的链接。这对每个人都有帮助。
很抱歉，该站点仍处于开发环境中，因此不向公众开放。它肯定与 resize 属性有关，因为我刚刚删除了“jQuery(document).ready(function() { loadingsinglemap(); })”这一行，现在它可以正确加载 onclick。但是，如果您直接转到选项卡，它根本不会加载。并且在随后点击链接时，灰色图像也会返回。
如果我在链接上单击两次，它现在已经到了地图显示的阶段，但是如果我在隐藏后返回选项卡，那么它会以灰色模式开始。

标签： google-maps google-maps-api-3

【解决方案1】：

在取消隐藏 div 后再次调用 initilize() 函数。我做到了，它奏效了。 JSFiddle

【讨论】：

工作，非常感谢。抱歉延迟回复。

【解决方案2】：

我发现不是隐藏 div 而是将它的高度/宽度设置为 0px；并将其溢出设置为隐藏。

帮了我希望对你有帮助:)

【讨论】：

隐藏的 div 是我使用 jquery 显示/隐藏的标签容器。

【解决方案3】：

在这里查看 Roosko 的答案 https://groups.google.com/forum/#!topic/google-maps-js-api-v3/aUrVnx-i7LI，它对我有用！

由于地图在模态框获得定义的大小之前加载，因此它呈现大小为零。

<a href="#?w=500" rel="popup2" class="poplight" onClick="initialize()">
    <img src='images/location1.png' title='Location' alt='images/location2.png' />
</a>

点击弹窗时我调用了initilize()函数。

【讨论】：

请在此处添加链接中最重要的点。链接可能会过时，答案将不再有用。