全屏切换谷歌地图

-1

我正在开发一个项目，将特定位置添加到Google地图上。所有的工作很好：http://www.secret-vault.com/nostradamus/locations.html 全屏切换谷歌地图

我已经添加了一个切换（jQuery）按钮来切换到全屏（可以通过按Esc键转义）。

 $("#map_toggler").click(function() { 
      $("#map").toggleClass("fullscreen") 
     });

，并用于支持CSS的地图更改为全屏：

#map.fullscreen { 
    position: fixed !important; 
    top:0; 
    left:0; 
    z-index:1; 
    width:100%; 
    height: 100%; 
    margin:0; 
    padding:0; 
}

我重新填充等，看看这是问题的根源。

问题是......有时它会全屏显示，其他时候它会占满高度或返回原始高度。这在放大/缩小时尤其如此。

这里也有类似的问题：How do I create a show full screen button to toggle my google maps page to be full screen?但这个解决方案似乎并没有这样做。

来源

2017-08-03 Pete - iCalculator

可以请您发布代码的小提琴，以查看您所得到的行为吗？ – randomguy04

我完成了一些进一步的测试，这个问题似乎与Google Api本身有关。我有大宽屏显示器。我只是在其他设备和标准监视器上进行测试，并且全屏按预期工作。问题似乎在使用宽屏显示器时发生，基本上一页的百分比显示为白色，而不是显示整个地图。 –

为什么downvotes？没有提供反馈就没有意义。 –

感谢从Emmanual

的闪烁效果是通过在API中的错误引起的洞察力。更改缩放时，地图仍会查找原始容器大小。显然，缩放设置中的某个元素会捕捉尺寸参数。

这可以通过首先将地图设置为全屏，然后改变以适应容器来解决。查看此文章的详细信息：Google maps responsive resize

感谢支持的人。

来源

2017-08-05 08:12:45

全屏切换谷歌地图

回答

相关问题