1

使用谷歌地球，我有一个加载的 kml 图层，显示美国每个县的多边形。单击气球时会弹出一些有关状态的相关信息（名称、状态、区域等） 当用户单击多边形时，我希望该信息也可以在其他地方的 DIV 元素上弹出。

到目前为止，这是我的代码。

var ge;
google.load("earth", "1");

function init() {
    google.earth.createInstance('map3d', initCB, failureCB);
}

function initCB(instance) {
    ge = instance;
    ge.getWindow().setVisibility(true);
    ge.getNavigationControl().setVisibility(ge.VISIBILITY_AUTO);
    ge.getNavigationControl().setStreetViewEnabled(true);
    ge.getLayerRoot().enableLayerById(ge.LAYER_ROADS, true);

    //here is where im loading the kml file 
    google.earth.fetchKml(ge, href, function (kmlObject) {
        if (kmlObject) {
            // show it on Earth
            ge.getFeatures().appendChild(kmlObject);
        } else {
            setTimeout(function () {
                alert('Bad or null KML.');
            }, 0);
        }
    });

    function recordEvent(event) {
        alert("click");
    }

    // Listen to the mousemove event on the globe.
    google.earth.addEventListener(ge.getGlobe(), 'click', recordEvent);
}

function failureCB(errorCode) {}

google.setOnLoadCallback(init);

我的问题是，当我更改ge.getGlobe()为 kmlObject 或ge.getFeatures()它不起作用时。

我的第一个问题是，当用户单击 kml 图层的多边形时，我应该如何更改 ge.getGlobe() 才能获得单击侦听器？

之后，我计划使用getDescription()或getBalloonHtml()获取多边形气球信息。我什至走在正确的轨道上吗？

4

2 回答 2

1

...我应该将 ge.getGlobe() 更改为...

您无需将事件对象从GEGlobe. 事实上，它是最好的选择，因为您可以使用它来捕获所有事件，然后在处理程序中检查目标对象。这意味着您只需在 API 中设置一个事件侦听器。

另一种选择是以某种方式解析 KML 并将特定事件处理程序附加到特定对象。这意味着您必须为每个对象创建一个事件侦听器。

我什至走在正确的轨道上吗？

所以，是的，你在正确的轨道上。我会保留通用GEGlobe事件侦听器，但扩展您的recordEvent方法以检查您感兴趣的 KML 对象的类型。您没有显示您的 KML，因此很难知道您是如何构建它的（您<Polygon>的 s 是否嵌套在<Placemarks>或 `例如元素）。

在简单的情况下，如果您的多边形在地标中，那么您可以执行以下操作。基本上监听所有对象的点击，然后过滤所有 Placmark（通过 API 创建或通过 KML 加载）。

function recordEvent(event) {
  var target = event.getTarget();
  var type = target.getType();
  if(type == "KmlPolygon") {
  } else if(type == "KmlPlacemark") {
    // get the data you want from the target.
    var description = target.getDescription();
    var balloon = target.getBalloonHtml();
  } else if(type == "KmlLineString") {
    //etc...
  }
};

google.earth.addEventListener(ge.getGlobe(), 'click', recordEvent);

如果您想选择其他选项，您将在 KML Dom 加载后对其进行迭代，然后将事件添加到特定对象。你可以使用类似kmldomwalk.js的东西来做到这一点。虽然我不会在这里真正推荐这种方法，因为您将在 api 中创建大量事件侦听器（在这种情况下，每个 Placemark 一个）。好的一面是事件附加到 kml 文件中的每个特定对象，所以如果你有其他 Plaemarks 等，不应该有相同的“点击”行为，那么它可能很有用。

function placeMarkClick(event) { 
  var target = event.getTarget();
  // get the data you want from the target.
  var description = target.getDescription();
  var balloon = target.getBalloonHtml();
}

google.earth.fetchKml(ge, href, function (kml) {
    if (kml) {
        parseKml(kml);
    } else {
        setTimeout(function () {
            alert('Bad or null KML.');
        }, 0);
    }
});

function parseKml(kml) {
    ge.getFeatures().appendChild(kml);
    walkKmlDom(kml, function () {
        var type = this.getType();
        if (type == 'KmlPlacemark') {
          // add event listener to `this`
          google.earth.addEventListener(this, 'click', placeMarkClick);
        }
    });
};
于 2013-07-27T23:26:12.593 回答
0

很久以来我一直在处理这个问题.. 但我可以尝试帮助你或给你一些线索......

关于您关于“google.earth.addEventListener(ge.getGlobe(), 'click', recordEvent);”的问题 ge.getGlobe 不能替换为 ge.getFeatures() ：如果您查看 GEFeatureContainer 的文档（https://developers.google.com/earth/documentation/reference/interface_g_e_feature_container-members）（这是输出类型getFeatures() ，点击事件未定义！

ge.getGlobe 替换为 kmlObject：这里是什么 kmlObject？

关于使用getDescription，你能看看getTarget，getCurrentTarget ...（https://developers.google.com/earth/documentation/reference/interface_kml_event）

正如我告诉你的那样，我已经很久没有使用这个了。所以我不确定这对你有帮助，但至少，这是你可以看的第一首曲目！

请随时通知我！:-)

于 2013-07-26T09:12:54.610 回答