当我尝试使用缩放 1 或 2 仅查看大洲时,我可以看到屏幕重复了几次,并且大洲在屏幕中重复出现。(屏幕分成3帧)
我可以在屏幕上控制并只显示一次大陆而不重复吗?
问候,
约西
当我尝试使用缩放 1 或 2 仅查看大洲时,我可以看到屏幕重复了几次,并且大洲在屏幕中重复出现。(屏幕分成3帧)
我可以在屏幕上控制并只显示一次大陆而不重复吗?
问候,
约西
你所描述的是正常的;这就是谷歌地图处理非常低的缩放级别的方式。我还以全球缩放开始我的地图以显示所有大陆。另一个因素是用户的屏幕分辨率。我最初以 3 级缩放开始我的地图,但事实证明,一些屏幕分辨率设置较低的用户在首次加载地图时无法看到放置在我的地图上的所有内容。正因为如此,我现在从缩放 2 开始。屏幕分辨率较高的用户只是明白他们可能会在边缘看到世界地图的重复运行。
写一个黑客!这是缩放 0 的示例(查看页面时,缩小一次)。
该机制是监听缩放变化,并在低缩放时启用两个绝对定位的灰色 div(每侧一个)以覆盖“重复”。固定宽度的地图实际上是必要的。你需要新的 div 对来进行缩放 1 和 2。
最大的缺点是控件被 div 覆盖,将它们放在中心很难看(我试过了)。你可以只遮住地图的右半边,但效果也不太好。(见这里http://jsbin.com/ijojip/3/edit#preview)
google.maps.event.addListener(map, 'zoom_changed', function() {
if(map.getZoom() == 0) {
document.getElementById("leftcover").style.display = "block";
document.getElementById("rightcover").style.display = "block";
}
else {
document.getElementById("leftcover").style.display = "none";
document.getElementById("rightcover").style.display = "none";
}
});
#leftcover { position: absolute; height: 100%; background-color: #e5e3df; left: 0px; width: 128px; z-index: 2; display: none }
#rightcover { position: absolute; height: 100%; background-color: #e5e3df; left: 384px; width: 128px; z-index: 2; display: none }