3

假设我们用一些代码初始化了一个地图：

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-canvas-0"),
        mapOptions);
}

是否有一种简单的方法可以确定页面上的特定地图是否已初始化（在这种情况下，地图位于 id="map-canvas-0"）？

我可以想到一些使用隐藏字段的方法，但我希望有一种更简单的方法。

4

3 回答 3

5

我认为这里真正的问题是“在您的页面上，是否初始化地图意味着什么？”

在您提到的评论中，您可能在页面上有大约 200 个地图。当然，您的意思不是说您已经new google.maps.Map()为这 200 张地图中的每一张都调用过吗？这似乎会导致加载页面非常缓慢。

实际上，您是否有 200 个容器<div>元素，其中一些可能已经使用new google.maps.Map()as 在您的initialize()函数中使用 map 进行了初始化，而其中一些尚未使用该代码进行初始化，但在<div>您这样做之前只是空元素？

是不是你真正感兴趣的不是某个地图是否已完全加载，而只是你是否已经开始加载它？

例如，您可以有一个页面，您可以在其中单击一个框并开始加载地图。地图开始加载后，您不想在第二次单击时重新加载它。在这种情况下，您感兴趣的不是地图是否已完全加载，而是它是否已经开始加载。

如果这就是您正在做的事情，那么测试它的一种简单方法是查看<div>元素是否有任何子元素：

function hasMap( id ) {
    return !! document.getElementById(id).firstChild;
}

if( hasMap("map-canvas-0") ) {
    // That map has loaded or at least has started loading
}

如果您需要确定地图是否已完全加载，那么idle事件就是执行此操作的方法。在这一点上，究竟是使用隐藏字段还是 JavaScript 对象确实是一个折腾。JavaScript 对象非常简单：

var mapsLoaded = {};

function loadMap( id, lat, lng, zoom ) {
    var options = {
        center: new google.maps.LatLng( lat, lng ),
        zoom: zoom,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var container = document.getElementById( id );
    var map = new google.maps.Map( container, options );
    google.maps.event.addListener( map, 'idle' function() {
        mapsLoaded[id] = true;
    });
}

现在，如果您想知道是否加载了特定 ID 的地图，只需使用：

mapsLoaded[id]

例如

mapsLoaded['map-canvas-0']

将告诉您示例中的地图是否已满载。

如果这个答案看起来有点离谱，那么更全面地解释你在做什么呢？你什么时候创建你的容器元素——都是在页面初始化的时候，还是以后？何时以及如何创建地图？在用户点击或什么？容器 ID 是如何生成的？在什么情况下您需要知道地图是否已创建——您何时需要知道这一点以及为什么？

你越能清楚地说明这些问题，就越有可能有人可以帮助你给出具体的答案——你就越有可能有一个“啊哈”的时刻并确切地知道该怎么做。:-)

于 2013-05-24T06:21:23.923 回答
2

检查您的地图变量是否未定义...

经过

类型（地图）；

于 2013-05-24T05:45:22.157 回答
1

创建一个全局布尔变量并将其设置为 false。在地图初始化函数结束时，将其值更改为 true。

于 2013-05-22T23:00:09.777 回答