Question

我正在开发一个使用谷歌地图的项目。我使用HTML5地理定位来设置地图。如果不支持或拒绝地理定位，那么我可以任意设置地图中心。

我的问题是两件事：

关于谷歌地图加载的第一个问题：当地理定位被接受时，地图加载速度非常慢（我现在在中国，这可能是一个原因吗？）。在Firefox中，它甚至从未加载......但是没有javascript错误。
更一般地说，整个网站的显示非常错误。在缩小地图后，您应该会看到显示的标记。这没关系，但通常在地图下可以看到特定内容。这个内容几乎看不见，或被窗户整个宽度上散布的黑色块遮挡......

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

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

由于

修改如果我不提供URL来检查问题，你怎么能帮助我：it's here

Answer 1

http://victorinox.pythonanywhere.com/static/js/manager_functions.js，第143行：

出错

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

必须是

map.setCenter(new google.maps.LatLng(loc.coords.latitude, loc.coords.longitude));
//------------^

还有什么：当用户拒绝HTML5-geolocation的权限时，Firefox不会触发错误回调。正因为如此，并且没有为地图设置地图的中心，地图将无法加载，因为中心是必需的选项。

您可能认为中心将设置为初始化，但在firefox初始化时，当用户拒绝地理定位权限时，将永远不会调用。看看这个：

$(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();
    });
})

<强>建议：目前，您有一个闪烁的标记存在。您在多个事件（zoom_changed，dragend，resize）上重新加载标记，删除所有标记并根据XHR响应创建新标记。

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

仅更新bounds_changed上的标记而不是3个事件就足够了。

任何Web浏览器中的显示行为都很奇怪

1 个答案: