XSLT，Doctype和Google-Map v3不起作用 [英] XSLT, Doctype and Google-Map v3 not working
问题描述
我试图在使用XLS转换生成的HTML页面中包含GoogleMap v3（一切正常，v2）。我的JS代码来自此页面。
基本上，当所有东西都是纯HTML格式时，地图可以正常工作，但是当我尝试将它包含在XSL样式表中时，Firefox（v3.6 ）抱怨并且不想加载任何东西：
错误：未捕获的异常：[异常...操作不受支持代码：9nsresult：0x80530009（NS_ERROR_DOM_NOT_SUPPORTED_ERR）location： http：/ /maps.google.com/maps/api/js?sensor=false 行：9]
错误：google.maps.LatLng不是构造函数
源文件：file：///home/kevin/google/data.xml
行：2
这是我使用的XSL代码的简化版本：
<？xml version =1.0cn编码= ISO-8859-1 >？;
<！DOCTYPE xsl：stylesheet>
< xsl：stylesheet version =2.0xmlns：xsl =http://www.w3.org/1999/XSL/Transform>
< xsl：template match =/>
< html>
< head>
< meta name =viewportcontent =initial-scale = 1.0，user-scalable = no/>
< meta http-equiv =content-typecontent =text / html; charset = UTF-8/>
< style type =text / css>
html {height：100％}
body {height：100％; margin：0px; padding：0px}
#map_canvas {height：100％}
< / style>
< title> Google Maps JavaScript API v3示例：Map Simple< / title>
< script type =text / javascriptsrc =http://maps.google.com/maps/api/js?sensor=false>< / script>
< script type =text / javascript>
函数initialize（）{
var myLatlng = new google.maps.LatLng（-34.397,150.644）;
var myOptions = {
zoom：8，
center：myLatlng，
mapTypeId：google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map（document.getElementById（map_canvas），myOptions）;
}
< / script>
< / head>
< body onload =initialize（）>
< div id =map_canvas>< / div>
< / body>
< / html>
< / xsl：template>
< / xsl：stylesheet>
以及一个极简主义的XML文档来触发转换：
<？xml version =1.0encoding =ISO-8859-1？>
<！DOCTYPE xsl：stylesheet>
<？xml-stylesheet type =text / xslhref =Display.xsl？>
< root />
根据我的Google调查，问题可能来自错误的Doctype，但我并不真正知道如何解决这个问题，函数就像
< xsl：output method =html
indent =yes
omit-xml-declaration =yes
encoding =utf-8
doctype-public = - // W3C // DTD XHTML 1.0 Strict // EN
doctype-system =http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd/>
不会改变任何内容。
编辑：对于XML，我的实际DOCTYPE稍微更加完整：
<！DOCTYPE xsl：样式表[<！ENTITY auml&＃228; <！ENTITY ouml&＃246; ><！ENTITY uuml&＃252; ><！ENTITY szlig&＃223; <！ENTITY Auml&＃196; ><！ENTITY Ouml&＃214; <！ENTITY UUMl&＃220; ><！ENTITY euml&＃235; ><！ENTITY ocirc&＃244; ><！ENTITY nbsp&＃160; <！ENTITY Agrave&＃192; <！ENTITY Egrave&＃200; ><！ENTITY Eacute&＃201; <！ENTITY Ecirc&＃202; <！ENTITY egrave&＃232; ><！ENTITY eacute&＃233; <！ENTITY ecirc&＃234; <！ENTITY agrave&＃224; ><！ENTITY iuml&＃239; ><！ENTITY ugrave&＃249; ><！ENTITY ucirc&＃251; ><！ENTITY uuml&＃252; ><！ENTITY ccedil&＃231; ><！ENTITY AElig&＃198; ><！ENTITY aelig&＃330; ><！ENTITY OElig&＃338; ><！ENTITY oelig&＃339; <！ENTITY euro&＃8364;>><！ENTITY laquo&＃171; ><！ENTITY raquo&＃187; >]>
和XSL：
<！DOCTYPE xsl：stylesheet [
<！ENTITY％xhtml-lat1 SYSTEM
http://www.w3.org/TR/xhtml1/DTD/xhtml- lat1.ent>
<！ENTITY％xhtml-special SYSTEM
http://www.w3.org/TR/xhtml1/DTD/xhtml-special.ent\">
<！ENTITY％xhtml-symbol SYSTEM
http://www.w3.org/TR/xhtml1/DTD/xhtml-symbol.ent\">
％xhtml-lat1;
％xhtml-special;
％xhtml-symbol;
]>
正确处理我所有的口音和特殊字符，所以我想避免摆脱它，如果可能的话
编辑2 ：问题实际上与我尝试加载OpenStreetMap，但通过Mapstraction API完全相同， document.write 是不允许的。
当我使用回调函数时，Google Map v2能够正常工作的另一件事是：
http://maps.google.com/maps?file=api&v=2.x&key= {myKey}& c& async = 2& callback = {myInitFunct}
任何线索都可能出错？
http：// maps.google.com/maps/api/js?sensor=false&callback= {myInitFunction}
事实上，正如我们在生成的JS脚本中看到的，它们不会以相同的方式插入它们的代码：
使用回调：
函数getScript（src）{
var s = document.createElement（'script ）;
s.src = src;
document.body.appendChild（s）;
没有回调：
function getScript（src）{
document.write（'<'+'script src =''+ src +''+
'type =text / javascript><'+'/ script>'）;
其中 document.write 可能被禁止... ...
（但是，我不太明白为什么他们使用两个不同的代码来执行相同的操作，也许只是为了解决我们的问题:)
感谢本博客为教程
I'm trying to include a GoogleMap v3 (everything was okay with v2) in my HTML pages generated with XLS Transformations. My JS code comes from this page.
Basically, the map works correctly when everything is in plain HTML, as per the example, however when I try to include it in the XSL stylesheet, Firefox (v3.6) complains and doesn't want to load anything:
Error: uncaught exception: [Exception... "Operation is not supported" code: "9" nsresult: "0x80530009 (NS_ERROR_DOM_NOT_SUPPORTED_ERR)" location: "http://maps.google.com/maps/api/js?sensor=false Line: 9"]
Error: google.maps.LatLng is not a constructor Source File: file:///home/kevin/google/data.xml Line: 2
Here is a simplified version of the XSL code I'm using:
<?xml version="1.0" encoding="ISO-8859-1"?>
<!DOCTYPE xsl:stylesheet >
<xsl:stylesheet version="2.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<style type="text/css">
html { height: 100% }
body { height: 100%; margin: 0px; padding: 0px }
#map_canvas { height: 100% }
</style>
<title>Google Maps JavaScript API v3 Example: Map Simple</title>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
function initialize() {
var myLatlng = new google.maps.LatLng(-34.397, 150.644);
var myOptions = {
zoom: 8,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
}
</script>
</head>
<body onload="initialize()">
<div id="map_canvas"></div>
</body>
</html>
</xsl:template>
</xsl:stylesheet>
and a minimalist XML document to trigger the transformation:
<?xml version="1.0" encoding="ISO-8859-1"?>
<!DOCTYPE xsl:stylesheet>
<?xml-stylesheet type="text/xsl" href="Display.xsl"?>
<root />
According to my Google investigations, the problem might come from a wrong Doctype, but I don't really know how to fix it, functions like
<xsl:output method="html"
indent="yes"
omit-xml-declaration="yes"
encoding="utf-8"
doctype-public="-//W3C//DTD XHTML 1.0 Strict//EN"
doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" />
don't change anything.
EDIT: my actual DOCTYPE is slightly more comple, for XML:
<!DOCTYPE xsl:stylesheet [<!ENTITY auml "ä" ><!ENTITY ouml "ö" ><!ENTITY uuml "ü" ><!ENTITY szlig "ß" ><!ENTITY Auml "Ä" ><!ENTITY Ouml "Ö" ><!ENTITY Uuml "Ü" ><!ENTITY euml "ë" ><!ENTITY ocirc "ô" ><!ENTITY nbsp " " ><!ENTITY Agrave "À" ><!ENTITY Egrave "È" ><!ENTITY Eacute "É" ><!ENTITY Ecirc "Ê" ><!ENTITY egrave "è" ><!ENTITY eacute "é" ><!ENTITY ecirc "ê" ><!ENTITY agrave "à" ><!ENTITY iuml "ï" ><!ENTITY ugrave "ù" ><!ENTITY ucirc "û" ><!ENTITY uuml "ü" ><!ENTITY ccedil "ç" ><!ENTITY AElig "Æ" ><!ENTITY aelig "Ŋ" ><!ENTITY OElig "Œ" ><!ENTITY oelig "œ" ><!ENTITY euro "€"><!ENTITY laquo "«" ><!ENTITY raquo "»" >]>
and XSL:
<!DOCTYPE xsl:stylesheet [
<!ENTITY % xhtml-lat1 SYSTEM
"http://www.w3.org/TR/xhtml1/DTD/xhtml-lat1.ent">
<!ENTITY % xhtml-special SYSTEM
"http://www.w3.org/TR/xhtml1/DTD/xhtml-special.ent">
<!ENTITY % xhtml-symbol SYSTEM
"http://www.w3.org/TR/xhtml1/DTD/xhtml-symbol.ent">
%xhtml-lat1;
%xhtml-special;
%xhtml-symbol;
]>
to handle correctly all my accents and special chars, so I'd like to avoid getting rid of it, if possible
EDIT 2: the problem is actually exactly the same with I try to load an OpenStreetMap though Mapstraction API, document.write is not allowed.
Another thing it that Google Map v2 works correctly when I use a callback function:
http://maps.google.com/maps?file=api&v=2.x&key={myKey}&c&async=2&callback={myInitFunct}
Any clue about what can be wrong?
the solution is to use the callback parameter of the GoogleMap API:
http://maps.google.com/maps/api/js?sensor=false&callback={myInitFunction}
Indeed, as we can see in the generated JS script, they don't insert their code the same way:
With callback:
function getScript(src) {
var s = document.createElement('script');
s.src = src;
document.body.appendChild(s);
}
Without callback:
function getScript(src) {
document.write('<' + 'script src="' + src + '"' +
' type="text/javascript"><' + '/script>');
}
where document.write might be forbidden ...
(however, I don't really understand why they use two different code for the same action, maybe just to solve our problem :)
thanks to this blog for the tutorial
这篇关于XSLT，Doctype和Google-Map v3不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
