Html 在任何web浏览器中都会出现非常奇怪的显示行为

我正在做一个使用谷歌地图的项目。我使用HTML5地理定位来设置地图。 如果不支持或拒绝地理定位，则我会任意设置地图中心

我的问题在于两件事：

• 关于谷歌地图加载的第一个问题：当地理定位被接受时，地图的加载速度异常缓慢（我现在在中国，这可能是一个原因吗？）。在firefox中，它甚至从不加载。。。但是没有javascript错误

• 更一般地说，整个网站的显示都是有缺陷的。将地图放大到一定程度后，您应该会看到显示的标记。这很好，但是特定的内容通常在地图下可见。这些内容几乎看不见，或者被一块覆盖在整个窗口宽度上的难看的黑色块所隐藏

我正在使用bootstrap（包括响应CSS文件和javascript插件）、awesomefont和一些额外的javascript代码

你知道吗？特别是第二点让我发疯

谢谢

编辑 如果我不提供URL来检查问题，您如何帮助我：

第143行有一个错误：

map.setCenter(google.maps.LatLng(loc.coords.latitude, loc.coords.longitude));

一定是

map.setCenter(new google.maps.LatLng(loc.coords.latitude, loc.coords.longitude)); //------------^ 建议： 目前，您有一个闪烁的标记礼物。您可以在多个事件上重新加载标记（缩放、更改、拖动、调整大小），删除所有标记并基于XHR响应创建新标记

相反，您应该为标记创建一个缓存（您可以在其中识别它们，例如，基于XHR响应提供的某个ID）。 当您收到新响应时，仅当新标记不在缓存中时才创建新标记，其他标记在地图上保持可见（当您删除/隐藏视口中不可见的标记时，我看不到任何好处）

---

另外，只更新边界上的标记就足够了，而不是3个事件。

我在Google Chrome中得到一个JS错误：

Uncaught TypeError:Cannot call方法'lat'of null

在

victorinox.pythonanywhere.com:56

中。你是如何得出这个错误的？我再次通过缩放/拖动地图进行检查，没有错误……奇怪的是，我无法再重现错误。但我还是看不到地图，它只是一个灰色的矩形。奇怪。。。调试已确保geolocalize（）函数中的

map.setCenter（）

在这两种情况下都会执行。但它不会改变地图的状态谢谢，我已经找到了丢失的新地图。我不确定您看到了错误回调的哪个版本，但我认为更新的最新版本考虑了这一方面。这是你为markers更新政策提出的一个很好的建议，我知道这是一个不好的方法，但到目前为止可以想出一个更好的方法。我想一个面向全局变量的缓存可以缓存标记吗？再次感谢！与错误回调相关：不，不，当我拒绝权限时，映射不会加载到FF中。错误回调不会触发（这是当前的firefox实现），但是else分支也不会执行，因为地理位置在FF中可用。哪个版本？与缓存相关的current.related：可以，但也许您应该考虑重新设计实现。目前有几十个全局可访问的函数和变量，最好从单个对象运行整个应用程序。（看看地图API，只有一个名为“google”的全局对象，当您添加另一个API时，它也将成为“google”的一部分，它提供了更多的控制并减少了命名冲突）

$(function() {
     //creates the map, no center will be set in createMap()
    map = createMap();
     //in firefox there will not be set a center
     //when user denies permission, because error-callback will not execute
    geolocalize();
     // when the map 
    center = map.getCenter();
     //will never run, because when the map doesn't have a center 
     //there will no tiles load
    google.maps.event.addListenerOnce(map, 'tilesloaded', function() {
        initialize();
    });
})