放置在div内的Google地图不在位置

Question

两个重要事实：

1. 这就是我所说的'不在位置'：



1. 有问题的div最初有style="display:none;"（它只显示点击链接时的JQuery解决方案）。当删除该样式时，地图工作正常 - 但是，我需要那种风格，因为我不能允许那种di＆gt;显示直到链接被点击（屏幕截图左侧的链接之一）。

有人可以建议一种方法让地图正确显示吗？

如果没有，也许你可以建议一种方法来制作di＆gt;没有那种风格点击链接时显示/隐藏？请注意，它只是以相同方式显示/隐藏的七个div之一，因此解决方案必须考虑到这一点。这是我为每个div使用的jQuery（在点击链接时显示div并隐藏所有其他div）：

    <script type="text/javascript"> 
   $(function() {
       $('#show_mapa').click(function() {
           $('#mapa').show();
           $('#podaci').hide();
           $('#udaljenosti').hide();
           $('#pojedinosti').hide();
           $('#slika').hide();
           $('#slike').hide();
           $('#dodaj').hide();
           return false;
       });        
   });
</script>

Answer 1

当您在隐藏的div中初始化谷歌地图时，会发生这种情况。您需要在显示地图对象后调用方法以使其正确显示（onResize（））。

how to deal with google map inside of a hidden div (Updated picture)

这可能会有所帮助。

Answer 2

我记得我有同样的问题，实际上使用了相同的修复danp建议在这里找到：how to deal with google map inside of a hidden div (Updated picture)

这是另一种选择： 你总是可以添加一个监听器来观察链接上的点击，这就是所谓的“给我看地图”等等。然后，当点击链接时，只在一个单独的div中加载谷歌地图。

我个人喜欢使用onResize（）修复更好的显示/隐藏方式，但如果需要，可以尝试替代方案。

祝你好运！