来自url的kml气球中的动态内容

时间:2012-06-28 23:52:26

标签: kml google-earth google-earth-plugin balloon

我有一台服务器正在提供一个xhtml页面,其中包含我想要在Google地球(或世界风)气球中显示的所有内容。我希望地标气球在地图上点击时获取html页面。为了简单起见,当你从地图上点击它时,我希望我的气球成为www.yahoo.com。

任何在线搜索都会向我发送可以挂钩到google earth api的java代码。我真的希望有一个客户端kml方式来做到这一点。我是否可以使用扩展数据标签或描述标签来实现此功能?我甚至尝试使用嵌入式标签,这对于管视频非常有用,但是html页面没有插件。非常感谢任何帮助。

这也有效,但iframe非常难看 -

<Placemark> 
  <name>Test Placemark</name> 
    <description> 
      <![CDATA[ 
        <iframe src="http://www.yahoo.com" frameborder="0" 
           scrolling="auto" height="500" width="600"></iframe> 
      ]]> 
    </description> 
...

1 个答案:

答案 0 :(得分:0)

你可以试试getBalloonHtmlUnsafe()和HtmlDivBalloon吗? https://developers.google.com/earth/documentation/balloons#getballoonhtmlunsafe

但是,您要将kml添加到页面,然后将点击功能绑定到这些地标。

google.earth.fetchKml(ge, url, function(kmlObject){
   if(kmlObject){
      ge.getFeatures().appendChild(kmlObject);

      if(kmlObject.getType() === 'KmlPlacemark'){
          google.earth.addEventListener(kmlObject, 'click', function(event){
               event.preventDefault();

               var balloon = ge.createHtmlDivBalloon('');
               var content = kmlObject.getBalloonHtmlUnsafe();
               balloon.setFeature(kmlObject);
               var div = document.createElement('div');
               div.innerHTML = content;
               balloon.setContentDiv(div);

               ge.setBalloon(balloon);
          });
      }
   }
});

如果仍然无效,请记住google earth会擦除大量气球数据,因此您可能会尝试使用jquery来注入html。

var balloon = ge.createHtmlDivBalloon('');
var content = kmlObject.getBalloonHtmlUnsafe();
balloon.setFeature(kmlObject);
var div = document.createElement('div');
balloon.setContentDiv(div);

ge.setBalloon(balloon);
$(div).html(content);