PrimeFaces gmap not rendering_问答_开发者_运维开发者技术经验分享

开发者 https://www.devze.com 2023-02-05 16:22 出处：网络

Using PrimeFaces 2.2.RC2 in a JSF 2.0 project. I\'m trying to get a basic Google Map to render with the gmap component.No errors show up just blank page where the map should be.

Using PrimeFaces 2.2.RC2 in a JSF 2.0 project.

I'm trying to get a basic Google Map to render with the gmap component. No errors show up just blank page where the map should be.

My .xhtml file

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<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.prime.com.tr/ui">

    <h:head>
        <script src="http://maps.google.com/maps/api/js?sensor=false" 
              type="text/javascript"></scr开发者_高级运维ipt>
    </h:head>
    <h:body>
        <f:view contentType="text/html">
            <h1>Google Map</h1>
            <p:gmap center="41.381542, 2.122893" zoom="15" type="HYBIRD"
                    style="width:600px;height:400px" />
        </f:view>
    </h:body>
</html>

Not had any issues getting other PrimeFaces components to render in this project and the example on the PrimeFaces website renders in my browser just fine.

Any ideas ?

Update:

I changed the view tag to <f:view contentType="text/html">, now I get a grey box where the map should be and when I hover over the box the curser turns to white hand to grab and move the map around, but still no map shows.

PrimeFaces gmap not rendering

You need to add this script to you page:

<script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript" ></script>

<f:view contentType="text/html"> is needed for it to work in Safari/Chrome

My other problem was HYBRID was spelled wrong, the following works:

<h1>Google Map 1</h1>
<p:gmap center="41.381542, 2.122893" zoom="15" type="HYBRID"
  style="width:600px;height:400px" />

Spelling was never my strong suit.

This works for me

<h:head>
    <script src="http://maps.google.com/maps/api/js?sensor=false" 
          type="text/javascript"></script>
</h:head>
<h:body>
    <f:view contentType="text/html">
        <h1>Google Map</h1>
        <p:gmap center="41.381542, 2.122893" zoom="15" type="HYBRID" style="width:600px;height:400px" />
    </f:view>
</h:body>

Try this:

<h:form>
 <p:gmap center="41.381542, 2.122893" zoom="15" type="HYBRID"    
 style="width:600px;height:400px" streetView="true"/>
</h:form>

In recent times, you are supposed to provide a KEY https://stackoverflow.com/a/38248059/651288

otherwise you get a Google Maps API error: MissingKeyMapError

You can get a key here https://developers.google.com/maps/documentation/javascript/get-api-key

PrimeFaces gmap not rendering

精彩评论

关注公众号

热门标签

图文推荐

PrimeFaces gmap not rendering

更多 问答 相关资讯：

精彩评论

关注公众号

热门标签

图文推荐

更多问答相关资讯：