【发布时间】:2013-06-17 05:49:59
【问题描述】:
我有一个 XML,它通过 XSLT 转换为 HTML。 XML 能够包含 JavaScript,并且它可以正确地将其转换为 HTML,就像我在许多其他页面中所做的那样。它只是不适用于 GoogleMaps,而且我怀疑我的 JavaScript 有问题。
生成的 HTML 的相关部分如下所示。
HTML/脚本中发生了什么:
- API 是从 googleapis.com 加载的
- 创建了一个 ID 为 map_canvas 的 div。
- 定义了一个函数start(),通过
<body onload="start();">启动。 - 在此函数中,创建了一个变量 map_canvas 并将其传递给 引用名为 map_canvas 的 div 对象。
- 为了控制这一步是否有效,我为 div 设置了新背景 红色。
- 有效。
- 接下来,我要创建变量 var_options 并设置初始值 center、zoom 和 mapTypeId 的值。
- 为了控制这一步是否有效,我为 div 设置了新背景 蓝色。
- 这不起作用,它保持红色。
- 因此,该指令未执行。
- 所以我检查我是否可以访问对象
google.maps。 - 如果是这样,我给 div 赋予新的背景颜色绿色。
- 这行得通,所以我可以访问这个对象。
- 交叉检查:如果我注释掉加载 API 的语句,则 颜色不变。
对我来说,这看起来像是下面的某个地方有问题。
var map_options = {
center: new google.maps.LatLng(44.54, -78.54),
zoom: 8,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
但几个小时后,我仍然无法弄清楚它是什么。
<html>
<head>
...
<script src="http://maps.googleapis.com/maps/api/js?sensor=false" type="text/javascript">
</script>
<script type="text/javascript">
function start()
{
var map_canvas = document.getElementById('map_canvas');
// If the element can be located, we make it green. Checked.
// If we give the function another name than start, it won't be executed. Checked.
map_canvas.style.backgroundColor = 'green';
if(typeof google.maps != 'undefined') {
// If the google.maps object exists, we make the canvas red. Checked.
// If the API was not loaded from googleapis (commented out), it will stay green.
map_canvas.style.backgroundColor = 'red';
}
// So why does the following not work?
var map_options = {
center: new google.maps.LatLng(44.54, -78.54),
zoom: 8,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
// Not arriving here:
map_canvas.style.backgroundColor = 'blue';
// Before going on, I want to solve above problem, so this is commented out.
// var map = new google.maps.Map(map_canvas, map_options);
// map_canvas.style.backgroundColor = 'black';
}
</script>
</head>
<body onload="start();">
...
<div style="width: 400px; height: 224px;" id="map_canvas"></div>
...
</body>
</html>
【问题讨论】:
-
控制台出现什么错误?
-
代码给了我错误,传感器必须是真或假。我进行了一些测试,并将您的 googleapis url 更改为
<script src="http://maps.googleapis.com/maps/api/js?sensor=false" type="text/javascript">有帮助。至少它不会在它之后出现错误并且元素变成蓝色(如预期的那样?)。我从传感器参数的前面删除了amp;。 -
谢谢普斯基斯。这是一个复制粘贴的rmnant,最初我使用key=xxx,但后来我了解到,它不再需要了。 - 但是,我的代码仍然不起作用,即 div 保持红色。
-
@Bergi。它指的是加载的 js 的第 9 行,其内容为:'' type="text/javascript">');'。它说:[13:54:46.604] InvalidStateError:“试图使用一个不可用或不再可用的对象@maps.googleapis.com/maps/api/js?sensor=false:9”
-
您使用的是什么浏览器(版本)?看起来这是一个特定于浏览器的错误。
标签: javascript html google-maps firefox