1

我正在尝试在 wy jsf 2 和 richfaces 4 网站上嵌入谷歌地图 v3。一切似乎都正常，但我的地图没有呈现，即使当我查看控制台时我看到地图图像已下载但在我的页面中不可见。这是我在 Web 控制台上的结果

[00:20:33,874] GET http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js [HTTP/1.1 200 OK 4328ms]
[00:20:33,882] GET http://maps.google.com/maps/api/js?key={MYKEY}&sensor=true [HTTP/1.1 200 OK 2062ms]
...
[00:20:44,334] GET http://maps.gstatic.com/cat_js/intl/fr_ALL/mapfiles/api-3/12/2/%7Bcommon,map%7D.js [HTTP/1.1 200 OK 1437ms]
[00:20:46,052] GET http://maps.gstatic.com/mapfiles/openhand_8_8.cur [HTTP/1.1 200 OK 437ms]
[00:20:46,119] GET http://maps.gstatic.com/cat_js/intl/fr_ALL/mapfiles/api-3/12/2/%7Butil,onion%7D.js [HTTP/1.1 200 OK 2219ms]
[00:20:46,143] GET http://maps.gstatic.com/mapfiles/transparent.png [HTTP/1.1 200 OK 907ms]
[00:20:46,180] GET http://maps.googleapis.com/maps/api/js/ViewportInfoService.GetViewportInfo?1m6&1m2&1d-34.397&2d148.83125500000006&2m2&1d-34.396999&2d152.45674499999996&2u8&4sfr&5e0&6sm%40209000000&7b0&8e0&9b0&callback=_xdc_._bge38k&token=99037 [HTTP/1.1 200 OK 1000ms]
[00:20:46,199] GET http://mt0.googleapis.com/vt?lyrs=m@209000000&src=apiv3&hl=fr&x=234&y=153&z=8&s=Galileo&style=api%7Csmartmaps [HTTP/1.1 200 OK 3094ms]
[00:20:46,244] GET http://maps.gstatic.com/cat_js/intl/fr_ALL/mapfiles/api-3/12/2/%7Bcontrols,stats%7D.js [HTTP/1.1 200 OK 2656ms]
[00:20:46,283] GET http://mt0.googleapis.com/vt?lyrs=m@209000000&src=apiv3&hl=fr&x=234&y=154&z=8&s=&style=api%7Csmartmaps [HTTP/1.1 200 OK 3343ms]
[00:20:46,298] GET http://mt1.googleapis.com/vt?lyrs=m@209000000&src=apiv3&hl=fr&x=235&y=153&z=8&s=Ga&style=api%7Csmartmaps [HTTP/1.1 200 OK 4031ms]
[00:20:46,320] GET http://mt1.googleapis.com/vt?lyrs=m@209000000&src=apiv3&hl=fr&x=235&y=154&z=8&s=Gal&style=api%7Csmartmaps [HTTP/1.1 200 OK 4906ms]
[00:20:48,497] GET http://mt0.googleapis.com/mapslt/ft?hl=fr&lyrs=m%40209000000%7Csalt%3A190877606&las=wvvuwtvu,wvvuwtvw,wvvuwtwt,wvvuwtwv&z=8&src=apiv3&xc=1&style=api%7Csmartmaps&callback=_xdc_._90cyl4&token=91449 [HTTP/1.1 200 OK 1187ms]
[00:20:49,196] GET http://maps.googleapis.com/maps/api/js/AuthenticationService.Authenticate?1shttp%3A%2F%2Flocalhost%3A8080%2Fhereka%2Fhome.jsf&{MYKEY}&5e1&callback=_xdc_._isjeo3&token=31472 [HTTP/1.1 200 OK 688ms]
[00:20:49,216] GET http://maps.gstatic.com/mapfiles/google_white.png [HTTP/1.1 200 OK 1047ms]
[00:20:49,231] GET http://maps.gstatic.com/mapfiles/mv/imgs8.png [HTTP/1.1 200 OK 1781ms]
[00:20:49,263] GET http://maps.gstatic.com/mapfiles/cb/mod_cb_scout/cb_scout_sprite_api_003.png [HTTP/1.1 200 OK 1531ms]
[00:20:49,279] GET http://maps.gstatic.com/mapfiles/rotate2.png [HTTP/1.1 200 OK 1422ms]
[00:20:49,295] GET http://maps.gstatic.com/mapfiles/szc4.png [HTTP/1.1 200 OK 1312ms]
[00:20:49,310] GET http://maps.gstatic.com/mapfiles/arrow-down.png [HTTP/1.1 200 OK 1328ms]
[00:20:49,326] GET http://maps.gstatic.com/cat_js/intl/fr_ALL/mapfiles/api-3/12/2/%7Bmarker%7D.js [HTTP/1.1 200 OK 1765ms]
[00:20:49,978] GET http://maps.googleapis.com/maps/gen_204?ev=api_viewport&cad=mt:m,c:-34.397%2C150.644,sp:0.00000x1.20850,src:apiv3,ts:3ecpy0 [HTTP/1.1 204 No Content 641ms]
[00:20:52,184] GET http://csi.gstatic.com/csi?v=2&s=mapsapi3&action=apiboot&rt=jl.1604,mc.3136,mb.4730,ep.6019,vt.10080,prt.10080,plt.8548,mt.10080&size=220x0&maptype=m [HTTP/1.1 204 No Content 2266ms]
[00:20:56,231] GET http://maps.googleapis.com/maps/api/js/QuotaService.RecordEvent?1shttp%3A%2F%2Flocalhost%3A8080%2Fhereka%2Fhome.jsf&3sAIzaSyAoq4IqVvGnLj0bpMOCNxiwufA_-4zZxBc&4e1&5e0&6u1&7s3ecvhs&callback=_xdc_._lg61t8&token=39523 [HTTP/1.1 200 OK 531ms]

这是我的页面模板：

<?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:ui="http://java.sun.com/jsf/facelets"
      xmlns:a4j="http://richfaces.org/a4j"
      xmlns:rich="http://richfaces.org/rich">
    <h:head>
       <title><ui:insert name="windowTitle"/></title>
       <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
       <script type="text/javascript" src="http://maps.google.com/maps/api/js?key={MYKEY}&amp;sensor=true"></script>
<script src="./Scripts/gmaps.js"></script>

<script type="text/javascript">
function initialize() {
  var mapOptions = {
    center: new google.maps.LatLng(-34.397, 150.644),
    zoom: 8,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };
  var map = new google.maps.Map(document.getElementById("map"),
      mapOptions);
}
</script>


    </h:head>

    <h:body  onload="initialize()">

      <f:view locale="#{usersession.myLocale.code}">

                   <div id="advert2">
                      <ui:insert name="advert2">
                           <ui:include src="/composant/pub/pub.xhtml"/>
                      </ui:insert>
                   </div>  
    </f:view>
</h:body>
 </html>

这里是地图页面：

<?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:ui="http://java.sun.com/jsf/facelets"
      xmlns:a4j="http://richfaces.org/a4j"
      xmlns:rich="http://richfaces.org/rich">
    <h:head>
       <title><ui:insert name="windowTitle"/></title>

    </h:head>

<body >
    <h:form>
    <div id="map"></div>
</h:form>
</body>
</html>
4

1 回答 1

3

在上面的评论部分，所有功劳都归功于 Dr.Molle，但他的回答正是我需要修复我的第一张地图，我觉得它应该被称为正确的答案。

<div id="map" style="height:300px" />
于 2013-06-10T14:55:35.473 回答