Google map v3 api 在引导程序中未正确呈现（不涉及选项卡）

Question

我现在正在尝试解决谷歌地图在网站上未正确呈现的问题。 See Screenshot of correct and false rendering。

我希望你知道问题出在哪里，因为我现在很绝望。最坏的情况是，它是其他人可能的解决方案的一个很好的集合:) 我看到的行为是：

• 列表项地图部分加载左上角
• 列表项双击未渲染区域会在第一个较小的地图下方创建第二个地图
• 列表项如果页面快速重新加载多次，则大约 10-30% 的地图显示时间会更正

尝试了解决方案，但到目前为止没有成功： - 调整地图大小google.maps.event.trigger(map, 'resize')

• 收到空闲状态后调整地图大小 google.maps.event.addListenerOnce(map, 'idle', function() {google.maps.event.trigger(map, 'resize');});

• 同时调整地图大小和设置中心

• 使用按钮手动触发调整大小事件

• 在文档准备好后初始化地图 $(document).ready(function() {initialize();});

• 在 settimeout 最多 10 秒后初始化地图 setTimeout(initialize, 1000);

• 检测父 div 的宽度和高度，只有在足够大时才初始化

• 将父 div 的宽度和高度分配给地图画布

• 将父 div 的宽度和高度分配给 .gm 样式

• CSS：将宽度和高度与 px 分配给画布

• CSS：为画布分配 100% 的宽度和高度

• CSS：将宽度和高度与 px 和 100% 的组合分配给画布

• CSS：更改最大宽度#map-canvas img {max-width: none !important;}

• CSS：更改最大宽度#map-canvas img {max-width: none !important;}

想法和观察：

问题是零星的，这让我相信它与加载时间有关 画布在初始化之前已经具有正确的尺寸并且是完全可见的（即没有隐藏的选项卡等） Google 徽标、报告错误、联系方式等附加按钮可见且大小合适。我相信这意味着无论出于何种原因，Google Map 都无法在完整的画布上呈现地图本身，同时它仍能检测到正确的尺寸

用于寻找解决方案的关键字： Google Map API v3 问题，Google Map Rendering 问题，Google Map 左上角，Google Map Bootsstrap 问题

我已经尽量简化了html代码，以防你想看https://apptest.voiceoffriends.com/user.html

提前感谢您提供有关如何修复错误的任何提示或方法。

Answer 1

问题是这样的：

  function NoGeoLocationFound() {
                        clearTimeout(location_timeout);
                        var pos = new google.maps.LatLng();
                        map.setCenter(pos);

                    };

pos 不是有效的LatLng（缺少参数）