Google maps api 3 谷歌地图不显示在基础部分

我的问题与被问的问题相同，但前提是没有被接受的答案，而且我的程序不同，我将开启一个新的程序

在基础选项卡中有一个隐藏在开始时的地图，它只在打开时显示地图的一部分。我已经阅读了与此相关的文章，并尝试了尝试，但没有运气。我知道我必须在更改选项卡时重新初始化映射，但我无法使其工作

我有一个保存所有地图信息的函数：

功能启动映射（obj）{
var markers=新数组（）；
var glat_center=$（obj.attr（'data-glat'）；
变量glong_center=$（obj）.attr（'data-glong'）；
var Latlng_center=新的google.maps.Latlng（glat_center，glong_center）；
变量映射选项={
缩放：缩放，
滚轮：错误，
中心：拉特努中心，
mapTypeId:google.maps.mapTypeId.ROADMAP，
样式：地图样式，
mapTypeControl:false，
街景控制：错误，
minZoom:4，
ZoomControl选项：{
样式：google.maps.ZoomControlStyle.SMALL，
位置：google.maps.ControlPosition.TOP\u右
}
};
var map=new google.maps.map（obj，mapOptions）；
if（$（obj.attr（'data-glat'）&&$（obj.attr（'data-glong'））{
var glat=$（obj.attr（'data-glat'）；
var glong=$（obj.attr（'data-glong'）；
var Latlng=新的google.maps.Latlng（glat，glong）；
var marker=new google.maps.marker({
位置：Latlng，
地图：地图
});
}
}

我的html标记如下所示

所以，我想做的是在点击选项卡时调用这个函数，因为在基础文档中找不到任何其他选项卡事件。首先，我找到包含映射的选项卡的.title，然后查看是否存在映射（以防万一），然后调用保存映射的div上的函数

$（'.tabs.property location'）。查找（'.title'）。单击（函数（）{
if（$（'.tab content'）.find（'.google map'））.length）{
//log（“我找到了一张地图”）；
startMap（$（'.googlemap'））；
}
});

我知道它正在查找映射，因为我将console.log记录它，但控制台会抛出此错误

NS_ERROR_FAILURE: Component returned failure code: 0x80004005 (NS_ERROR_FAILURE) [nsIDOMWindow.getComputedStyle]

以下src

http://maps.gstatic.com/intl/es_ALL/mapfiles/api-3/14/7/main.js

所以是谷歌地图JS抛出了这个错误，但我不明白为什么

---

我知道这很难，但是有什么想法吗？

你传递了一个jQuery元素，但是谷歌地图需要一个

HTMLElement

。使用

var-map=document.querySelector（'.google-map'）；
startMap（地图）；

而不是

startMap（$（'.googlemap'））；

---

您可以使用

getElementsByClassName

var-map=document.getElementsByClassName（'google-map'）[0]；

但通常推荐的方法是通过

id

引用地图：

var-map=document.getElementById（'the-google-map'）；

非常感谢您！我真的是一个JS新手，我会花很多时间去了解发生了什么。。。为什么建议使用

id

方法，速度更快吗？无论如何，现在正在工作，我添加了一些代码来检查地图是否已经加载，所以我不会每次都加载它。Gr8！是的，但如果只有一个要素，就不应该关心它。getElementById是所有google示例的编码方式，也是一种逻辑选择，因为在创建google地图时，您总是一次以单个元素为目标。