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

Question

我发现其他堆栈溢出问题表明使用'idle'事件是在谷歌地图完全加载时触发回调的方法.但在我的情况下,我想运行一些代码将一些文本注入到地图UI中的一个元素中,但我发现在创建这些元素之前"空闲"会触发.

为了明确,我将一个初始化函数附加到窗口的加载方法:

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中插入更多文本,所以我需要那些在那里.

我已经尝试过这个作为initialize方法的最后一行:

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

但是,emitText有一行尝试getElementById("cd")(地图上的controlsDiv),但我得到它是null,因为在CONTROLDiv实际完成加载之前,emitText已经触发了.

那么,问题是如何检测地图的完整加载,包括任何UI div.我的测试表明,'DOM'事件是在UI元素加载并在DOM中访问之前触发的.提前致谢!

Answer 1

只需访问controlsDiv而不是getElementById("cd")，div 是否已添加到文档中并不重要。