gpt4 book ai didi

css - Primefaces googlemap 不呈现

转载 作者:行者123 更新时间:2023-11-28 12:09:27 25 4
gpt4 key购买 nike

我有以下代码使用 primefaces 显示 googlemap。这不是渲染 map 。但是,如果我设置 style="width:600px;height:400px"它工作正常。如何在浏览器中获得 map 的完整页面 View ?

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui">
<h:head>
<script src="http://maps.google.com/maps/api/js?sensor=false&amp;v=3.4" type="text/javascript"></script>
</h:head>
<h:body>
<f:view contentType="text/html">
<h:form>
<p:gmap center="#{loadBean.centerLatitude},#{loadBean.centerLongitude}" style="width:100%;height:100%" zoom="3" type="HYBRID"/>
</h:form>
</f:view>
</h:body>
</html>

最佳答案

有两种方式:

1 只需设置 map 的绝对位置即可:

<p:gmap tyle="width:100%;height:100%;position:absolute" center="#{loadBean.centerLatitude},#{loadBean.centerLongitude}" zoom="3" type="HYBRID"/>

2 您还可以为 map 的所有父级设置宽度和高度。

添加:

<style type="text/css">
html, body {
width:100%;
height:100%;
}
</style>

修改你的<h:form> :

<h:form style="width:100%;height:100%">
. . .
</h:form>

关于css - Primefaces googlemap 不呈现,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19580807/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com