【发布时间】：2011-12-11 18:22:14
【问题描述】：
我被设置了一项任务，其中一部分是在我使用 XSLT 和 JQuery 移动创建的页面上显示谷歌地图。我看过一些与我正在做的类似的例子，但它们似乎对我不起作用。这是我当前尝试中涉及的线条，谁能告诉我为什么地图不会出现？我的预期结果是谷歌地图显示在每个餐厅页面上定义的表格的单元格中。
<?xml version="1.0" encoding="ISO-8859-1"?><!-- DWXMLSource="restaurants.xml" -->
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html" indent="yes"/>
<xsl:template match="/">
<!--<xsl:text disable-output-escaping="yes">
<!DOCTYPE html>
</xsl:text>-->
<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>Choose a restaurant</title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0rc2/jquery.mobile-1.0rc2.min.css" />
<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0rc2/jquery.mobile-1.0rc2.min.js"></script>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
function initialize() {
var latlng = new google.maps.LatLng(-34.397, 150.644);
var myOptions = {
zoom: 8,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"),
myOptions);
}
</script>
</head>
<body onload="initialize()">
<div data-role="page" id="frontpage">
<div data-role="header">
<h1>Choose a Restaurant</h1>
</div><!-- /header -->
<div data-role="content">
<xsl:for-each select="listing/restaurant">
<div data-role="collapsible" data-theme="a" data-content-theme="a">
<h3><xsl:value-of select="name"/> - <xsl:value-of select="cuisine"/> - Price range:- <xsl:value-of select="price"/></h3>
<table border="0" cellpadding="10">
<tr>
<td><p><img><xsl:attribute name="src"><xsl:value-of select="picture" /></xsl:attribute></img></p></td>
</div>
</xsl:for-each>
</div>
<!-- /content -->
<div data-role="footer">
<h4>Choose a Restaurant</h4>
</div><!-- /footer -->
</div><!-- /page -->
<div data-role="page" id="rest1">
<div data-role="header">
<xsl:for-each select="listing/restaurant[restid ='rest1']">
<h1><xsl:value-of select="name"/></h1>
</xsl:for-each>
</div>
<div data-role="content">
<xsl:for-each select="listing/restaurant[restid ='rest1']">
<table border="1" cellspacing="10" cellpadding = "5">
<tr>
<td><img><xsl:attribute name="src"><xsl:value-of select="picture" /></xsl:attribute </img></td>
<td>
<p><xsl:value-of select="opening_times/monday"/></p>
<p><xsl:value-of select="opening_times/tuesday"/></p>
<p><xsl:value-of select="opening_times/wednesday"/></p>
<p><xsl:value-of select="opening_times/thursday"/></p>
<p><xsl:value-of select="opening_times/friday"/></p>
<p><xsl:value-of select="opening_times/saturday"/></p>
<p><xsl:value-of select="opening_times/sunday"/></p>
</td>
<td><div id="map_canvas" ></div></td>
</tr>
<tr>
<td><p>Christmas Offer:- <xsl:value-of select="christmas_offer"/></p></td>
<td><center><p>Overall Rating:- <xsl:value-of select="rating"/></p></center></td>
<td></td>
</tr>
</table>
</xsl:for-each>
</div>
<div data-role="footer">
<xsl:for-each select="listing/restaurant[restid ='rest1']">
<h4><xsl:value-of select="name"/></h4>
</xsl:for-each>
</div><!-- /footer -->
</div>
<div data-role="page" id="rest2">
<div data-role="header">
<xsl:for-each select="listing/restaurant[restid ='rest2']">
<h1><xsl:value-of select="name"/></h1>
</xsl:for-each>
</div>
<div data-role="content">
<xsl:for-each select="listing/restaurant[restid ='rest2']">
<table border="1" cellspacing="10" cellpadding = "5">
<tr>
<td><img><xsl:attribute name="src"><xsl:value-of select="picture" /></xsl:attribute></img></td>
<td>
<p><xsl:value-of select="opening_times/monday"/></p>
<p><xsl:value-of select="opening_times/tuesday"/></p>
<p><xsl:value-of select="opening_times/wednesday"/></p>
<p><xsl:value-of select="opening_times/thursday"/></p>
<p><xsl:value-of select="opening_times/friday"/></p>
<p><xsl:value-of select="opening_times/saturday"/></p>
<p><xsl:value-of select="opening_times/sunday"/></p>
</td>
</tr>
<tr>
<td><p>Christmas Offer:- <xsl:value-of select="christmas_offer"/></p></td>
<td><center><p>Overall Rating:- <xsl:value-of select="rating"/></p></center></td>
<td></td>
</tr>
</table>
</xsl:for-each>
</div>
<div data-role="footer">
<xsl:for-each select="listing/restaurant[restid ='rest2']">
<h4><xsl:value-of select="name"/></h4>
</xsl:for-each>
</div><!-- /footer -->
</div>
<div data-role="page" id="rest3">
<div data-role="header">
<xsl:for-each select="listing/restaurant[restid ='rest3']">
<h1><xsl:value-of select="name"/></h1>
</xsl:for-each>
</div>
<div data-role="content">
<xsl:for-each select="listing/restaurant[restid ='rest3']">
<table border="1" cellspacing="10" cellpadding = "5">
<tr>
<td><img><xsl:attribute name="src"><xsl:value-of select="picture" /></xsl:attribute> </img></td>
<td>
<p><xsl:value-of select="opening_times/monday"/></p>
<p><xsl:value-of select="opening_times/tuesday"/></p>
<p><xsl:value-of select="opening_times/wednesday"/></p>
<p><xsl:value-of select="opening_times/thursday"/></p>
<p><xsl:value-of select="opening_times/friday"/></p>
<p><xsl:value-of select="opening_times/saturday"/></p>
<p><xsl:value-of select="opening_times/sunday"/></p>
</td>
</tr>
<tr>
<td><p>Christmas Offer:- <xsl:value-of select="christmas_offer"/></p></td>
<td><center><p>Overall Rating:- <xsl:value-of select="rating"/></p></center></td>
<td></td>
</tr>
</table>
</xsl:for-each>
</div>
<div data-role="footer">
<xsl:for-each select="listing/restaurant[restid ='rest3']">
<h4><xsl:value-of select="name"/></h4>
</xsl:for-each>
</div><!-- /footer -->
</div>
<div data-role="page" id="rest4">
<div data-role="header">
<xsl:for-each select="listing/restaurant[restid ='rest4']">
<h1><xsl:value-of select="name"/></h1>
</xsl:for-each>
</div>
<div data-role="content">
<xsl:for-each select="listing/restaurant[restid ='rest4']">
<table border="1" cellspacing="10" cellpadding = "5">
<tr>
<td><img><xsl:attribute name="src"><xsl:value-of select="picture" /></xsl:attribute> </img></td>
<td>
<p><xsl:value-of select="opening_times/monday"/></p>
<p><xsl:value-of select="opening_times/tuesday"/></p>
<p><xsl:value-of select="opening_times/wednesday"/></p>
<p><xsl:value-of select="opening_times/thursday"/></p>
<p><xsl:value-of select="opening_times/friday"/></p>
<p><xsl:value-of select="opening_times/saturday"/></p>
<p><xsl:value-of select="opening_times/sunday"/></p>
</td>
</tr>
<tr>
<td><p>Christmas Offer:- <xsl:value-of select="christmas_offer"/></p></td>
<td><center><p>Overall Rating:- <xsl:value-of select="rating"/></p></center></td>
<td></td>
</tr>
</table>
</xsl:for-each>
</div>
<div data-role="footer">
<xsl:for-each select="listing/restaurant[restid ='rest4']">
<h4><xsl:value-of select="name"/></h4>
</xsl:for-each>
</div><!-- /footer -->
</div>
<div data-role="page" id="rest5">
<div data-role="header">
<xsl:for-each select="listing/restaurant[restid ='rest5']">
<h1><xsl:value-of select="name"/></h1>
</xsl:for-each>
</div>
<div data-role="content">
<xsl:for-each select="listing/restaurant[restid ='rest5']">
<table border="1" cellspacing="10" cellpadding = "5">
<tr>
<td><img><xsl:attribute name="src"><xsl:value-of select="picture" /></xsl:attribute> </img></td>
<td>
<p><xsl:value-of select="opening_times/monday"/></p>
<p><xsl:value-of select="opening_times/tuesday"/></p>
<p><xsl:value-of select="opening_times/wednesday"/></p>
<p><xsl:value-of select="opening_times/thursday"/></p>
<p><xsl:value-of select="opening_times/friday"/></p>
<p><xsl:value-of select="opening_times/saturday"/></p>
<p><xsl:value-of select="opening_times/sunday"/></p>
</td>
</tr>
<tr>
<td><p>Christmas Offer:- <xsl:value-of select="christmas_offer"/></p></td>
<td><center><p>Overall Rating:- <xsl:value-of select="rating"/></p></center></td>
<td></td>
</tr>
</table>
</xsl:for-each>
</div>
<div data-role="footer">
<xsl:for-each select="listing/restaurant[restid ='rest5']">
<h4><xsl:value-of select="name"/></h4>
</xsl:for-each>
</div><!-- /footer -->
</div>
<div data-role="page" id="rest6">
<div data-role="header">
<xsl:for-each select="listing/restaurant[restid ='rest6']">
<h1><xsl:value-of select="name"/></h1>
</xsl:for-each>
</div>
<div data-role="content">
<xsl:for-each select="listing/restaurant[restid ='rest6']">
<table border="1" cellspacing="10" cellpadding = "5">
<tr>
<td><img><xsl:attribute name="src"><xsl:value-of select="picture" /></xsl:attribute> </img></td>
<td>
<p><xsl:value-of select="opening_times/monday"/></p>
<p><xsl:value-of select="opening_times/tuesday"/></p>
<p><xsl:value-of select="opening_times/wednesday"/></p>
<p><xsl:value-of select="opening_times/thursday"/></p>
<p><xsl:value-of select="opening_times/friday"/></p>
<p><xsl:value-of select="opening_times/saturday"/></p>
<p><xsl:value-of select="opening_times/sunday"/></p>
</td>
</tr>
<tr>
<td><p>Christmas Offer:- <xsl:value-of select="christmas_offer"/></p></td>
<td><center><p>Overall Rating:- <xsl:value-of select="rating"/></p></center></td>
<td></td>
</tr>
</table>
</xsl:for-each>
</div>
<div data-role="footer">
<xsl:for-each select="listing/restaurant[restid ='rest6']">
<h4><xsl:value-of select="name"/></h4>
</xsl:for-each>
</div><!-- /footer -->
</div>
<div data-role="page" id="rest7">
<div data-role="header">
<xsl:for-each select="listing/restaurant[restid ='rest7']">
<h1><xsl:value-of select="name"/></h1>
</xsl:for-each>
</div>
<div data-role="content">
<xsl:for-each select="listing/restaurant[restid ='rest7']">
<table border="1" cellspacing="10" cellpadding = "5">
<tr>
<td><img><xsl:attribute name="src"><xsl:value-of select="picture" /></xsl:attribute></img></td>
<td>
<p><xsl:value-of select="opening_times/monday"/></p>
<p><xsl:value-of select="opening_times/tuesday"/></p>
<p><xsl:value-of select="opening_times/wednesday"/></p>
<p><xsl:value-of select="opening_times/thursday"/></p>
<p><xsl:value-of select="opening_times/friday"/></p>
<p><xsl:value-of select="opening_times/saturday"/></p>
<p><xsl:value-of select="opening_times/sunday"/></p>
</td>
</tr>
<tr>
<td><p>Christmas Offer:- <xsl:value-of select="christmas_offer"/></p></td>
<td><center><p>Overall Rating:- <xsl:value-of select="rating"/></p></center></td>
<td></td>
</tr>
</table>
</xsl:for-each>
</div>
<div data-role="footer">
<xsl:for-each select="listing/restaurant[restid ='rest7']">
<h4><xsl:value-of select="name"/></h4>
</xsl:for-each>
</div><!-- /footer -->
</div>
<div data-role="page" id="rest8">
<div data-role="header">
<xsl:for-each select="listing/restaurant[restid ='rest8']">
<h1><xsl:value-of select="name"/></h1>
</xsl:for-each>
</div>
<div data-role="content">
<xsl:for-each select="listing/restaurant[restid ='rest8']">
<table border="1" cellspacing="10" cellpadding = "5">
<tr>
<td><img><xsl:attribute name="src"><xsl:value-of select="picture" /></xsl:attribute></img></td>
<td>
<p><xsl:value-of select="opening_times/monday"/></p>
<p><xsl:value-of select="opening_times/tuesday"/></p>
<p><xsl:value-of select="opening_times/wednesday"/></p>
<p><xsl:value-of select="opening_times/thursday"/></p>
<p><xsl:value-of select="opening_times/friday"/></p>
<p><xsl:value-of select="opening_times/saturday"/></p>
<p><xsl:value-of select="opening_times/sunday"/></p>
</td>
</tr>
<tr>
<td><p>Christmas Offer:- <xsl:value-of select="christmas_offer"/></p></td>
<td><center><p>Overall Rating:- <xsl:value-of select="rating"/></p></center></td>
<td></td>
</tr>
</table>
</xsl:for-each>
</div>
<div data-role="footer">
<xsl:for-each select="listing/restaurant[restid ='rest8']">
<h4><xsl:value-of select="name"/></h4>
</xsl:for-each>
</div><!-- /footer -->
</div>
<div data-role="page" id="rest9">
<div data-role="header">
<xsl:for-each select="listing/restaurant[restid ='rest9']">
<h1><xsl:value-of select="name"/></h1>
</xsl:for-each>
</div>
<div data-role="content">
<xsl:for-each select="listing/restaurant[restid ='rest9']">
<table border="1" cellspacing="10" cellpadding = "5">
<tr>
<td><img><xsl:attribute name="src"><xsl:value-of select="picture" /></xsl:attribute></img></td>
<td>
<p><xsl:value-of select="opening_times/monday"/></p>
<p><xsl:value-of select="opening_times/tuesday"/></p>
<p><xsl:value-of select="opening_times/wednesday"/></p>
<p><xsl:value-of select="opening_times/thursday"/></p>
<p><xsl:value-of select="opening_times/friday"/></p>
<p><xsl:value-of select="opening_times/saturday"/></p>
<p><xsl:value-of select="opening_times/sunday"/></p>
</td>
</tr>
<tr>
<td><p>Christmas Offer:- <xsl:value-of select="christmas_offer"/></p></td>
<td><center><p>Overall Rating:- <xsl:value-of select="rating"/></p></center></td>
<td></td>
</tr>
</table>
</xsl:for-each>
</div>
<div data-role="footer">
<xsl:for-each select="listing/restaurant[restid ='rest9']">
<h4><xsl:value-of select="name"/></h4>
</xsl:for-each>
</div><!-- /footer -->
</div>
<div data-role="page" id="rest10">
<div data-role="header">
<xsl:for-each select="listing/restaurant[restid ='rest10']">
<h1><xsl:value-of select="name"/></h1>
</xsl:for-each>
</div>
<div data-role="content">
<xsl:for-each select="listing/restaurant[restid ='rest10']">
<table border="1" cellspacing="10" cellpadding = "5">
<tr>
<td><img><xsl:attribute name="src"><xsl:value-of select="picture" /></xsl:attribute></img></td>
<td>
<p><xsl:value-of select="opening_times/monday"/></p>
<p><xsl:value-of select="opening_times/tuesday"/></p>
<p><xsl:value-of select="opening_times/wednesday"/></p>
<p><xsl:value-of select="opening_times/thursday"/></p>
<p><xsl:value-of select="opening_times/friday"/></p>
<p><xsl:value-of select="opening_times/saturday"/></p>
<p><xsl:value-of select="opening_times/sunday"/></p>
</td>
</tr>
<tr>
<td><p>Christmas Offer:- <xsl:value-of select="christmas_offer"/></p></td>
<td><center><p>Overall Rating:- <xsl:value-of select="rating"/></p></center></td>
<td></td>
</tr>
</table>
</xsl:for-each>
</div>
<div data-role="footer">
<xsl:for-each select="listing/restaurant[restid ='rest10']">
<h4><xsl:value-of select="name"/></h4>
</xsl:for-each>
</div><!-- /footer -->
</div>
</body>
</html>
</xsl:template>
</xsl:stylesheet>
【问题讨论】：
-
您的 XSLT 代码不是格式良好的 XML 文档（提示：最后缺少某些内容）。此外，您还没有提供源 XML 文档，因此不可能在其上运行转换。最后，您还没有指定转换的预期结果是什么。请编辑问题并提供所有这些缺失的信息。
-
这就是您需要的全部信息吗？
-
@_Fred Ferguson：在发布问题之前，您需要做好“功课”。其中一部分是为了隔离问题并提供一个完整但尽可能小的代码示例来重现问题。发布 800 行代码（顺便说一句，有这么大的代码文件是一个很好的模式！），分成两个不同的部分，它们的组合不是格式良好的 XML——这不会吸引人们并激励他们考虑回答这个问题。更不用说仍然没有提供源 XML 文档，解释必须执行的转换也是如此。
-
弗雷德，我第二个@Dimitre。仅仅浏览发布的 XML 就令人眼花缭乱。清理这两个文档，删除所有与您的错误无关的数据，并让我们知道您遇到了什么错误。出现了什么？什么不是？
标签： google-maps xslt jquery-mobile