wy jsf 2 および richfaces 4 Web サイトに Google マップ 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}&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>