css - 当style =“display:none”时，Primefaces gmap无法渲染

这正在工作：

<h:panelGroup layout="block" id="map-wrapper">
                <p:gmap center="#{locationService.getLatLngAsString(userSession.location)}"
                        zoom="15"
                        type="HYBRID"
                        model="#{addOfferController.emptyModel}"
                        onPointClick="handlePointClick(event);"
                        style="width:600px;height:400px"/>
            </h:panelGroup>

这不是：

<h:panelGroup layout="block" id="map-wrapper" style="display: none">
                <p:gmap center="#{locationService.getLatLngAsString(userSession.location)}"
                        zoom="15"
                        type="HYBRID"
                        model="#{addOfferController.emptyModel}"
                        onPointClick="handlePointClick(event);"
                        style="width:600px;height:400px"/>
            </h:panelGroup>

在第二个代码中，map-wrapper中只有指定高度和宽度的div。

可能是什么原因？

谢谢！

最佳答案

原因是某些PF组件需要尺寸信息才能在客户端呈现它们。当它们放在具有display: none;的容器中时，经常会出现问题。

我刚刚找到了一种解决方法：


将一个widgetVar属性添加到您的g：map组件widgetVar="gmap"
在同一页面中，添加此javascript <script type="text/javascript">gmap._render();</script>

关于css - 当style =“display:none”时，Primefaces gmap无法渲染，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/19067780/