javascript - 如何使 kmllayer 事件在谷歌地球插件上弹出气球

Question

我使用谷歌地图 API v3 设计了一个功能齐全的 map ，但我想使用谷歌地球插件创建完全相同的 map 。 map 可查here

我已成功加载 GE - 各大洲和地区的 kml 文件。然而我无法让点击事件起作用。不确定这是如何工作的，以下是我目前拥有的

google.earth.addEventListener(kmlLayer,'click',function(kmlEvent) {
            kmlEvent.preventDefault(); 
            console.log("help");


            $('#balloon').html("");
            kmlClick = true;
            var surveyid = kmlEvent.featureData.id;

            if(!updateSurveyFlag){
                updateSurveyView(surveyid, updateSurveyFlag);
            }
            console.log("help2");
            $.ajax({
                url : 'http://' + top.location.host + '/mcmap/feed/kml.php?action=kmlclick',
                data : "id=" + surveyid,
                dataType : 'json',
                success : function(data) {

控制台记录帮助后不会执行任何操作。我想使用 GE，因为性能比 GM 好得多，但前提是我使用网络链接。如果我使用 fetch kml 方法，则使用此 issue 中提到的扩展进行放大会很慢。

Answer 1

很可能是您对 jquery $('#balloon').html(""); 的调用失败。您很可能在 jquery 正确加载之前尝试调用代码。

要修复此问题，请确保对 jquery 的任何调用都在加载完成后发生。

另外，另一方面，我会尝试通过用命名方法替换匿名函数来分离调用。这种分离不会改变功能，它只是通过避免过度嵌套来保持代码更清晰。

// called when jquery and the document have finished loading
$(function() {
  google.earth.addEventListener(kmlLayer,'click', myEventListener);
});

// custom event listener
var myEventListener = function(kmlEvent) {
  kmlEvent.preventDefault(); 
  console.log("help");
  $('#balloon').html(""); // should work now as jquery is ready.
  kmlClick = true;
  var surveyid = kmlEvent.featureData.id;
  if(!updateSurveyFlag) {
    updateSurveyView(surveyid, updateSurveyFlag);
  }

  console.log("help2");

  // etc...
}