Question

我发现其他堆栈溢出问题表明使用“闲置”＃39;事件是在完全加载谷歌地图时触发回调的方式。但在我的情况下，我想运行一些代码将一些文本注入到地图用户界面中的一个元素中，但我发现这是一个空闲的＆＃39;在创建这些元素之前触发。

为明确起见，我将初始化函数附加到窗口的加载方法：

google.maps.event.addDomListener(window, 'load', initialize);

在初始化内部，我创建了一些UI元素并将它们附加到地图上：

function initialize() {
  map = new google.maps.Map(document.getElementById("map-div"), mapOptions);
  ...
  // set up the controls div 
  var controlsDiv = document.createElement('div');
  controlsDiv.id="cd";
  controlSetup(controlsDiv);
  map.controls[google.maps.ControlPosition.RIGHT_TOP].push(controlsDiv);
}

好的，但是我想做的就是一旦准备好就运行一个功能。在我的情况下，我将在控件div中插入更多文本，所以我需要那些文本。

我已尝试将其作为初始化方法的最后一行：

google.maps.events.addListenerOnce(map,'idle',emitText);

然而，emitText有一行尝试getElementById（＆＃34; cd＆＃34;）（地图上的controlsDiv），但我得到它是null因为emitText在controlsDiv实际完成加载之前已经触发

然后，问题是如何检测地图的完整加载，包括任何UI div。我的测试表明“闲置”。事件在UI元素加载并在DOM中可访问之前触发。提前谢谢！

Answer 1

只需访问controlsDiv而不是getElementById("cd")，如果已将div添加到文档中，则无关紧要。

Answer 2

当我想在添加到#map之后在side Element中运行jquery插件时遇到同样的问题。所以我通过回呼谷歌地图满负荷解决了

google.maps.event.addListenerOnce(g, 'idle', () => {
        setTimeout(function() {
         //do smt
        }, 1)
    });

加载Google地图控件元素时的回调

2 个答案: