谷歌地图信息窗口显示kml对象名称和链接

Google maps infowindow display kml object name and link

本文关键字：链接 对象 kml 信息 信息窗 窗口 显示 谷歌地图      更新时间：2023-09-26

我有一些在Google地图上显示KML层的工作代码。当你点击图层的各个部分时，它们各自的名称会弹出一个信息窗口。

<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <style type="text/css">
      html { height: 100% }
      body { height: 100%; margin: 0; padding: 0 }
      #map-canvas { height: 100% }
    </style>
    <script type="text/javascript"
// Load Google Maps API
      src="https://maps.googleapis.com/maps/api/js?key=XXXXXXXXXXX&sensor=false">
    </script>
    <script type="text/javascript">

function initialize() {
  var myLatlng = new google.maps.LatLng(51.875696, -0.624207);
  var mapOptions = {
    zoom: 6,
    center: myLatlng
  };
  var map = new google.maps.Map(document.getElementById('map-canvas'),
      mapOptions);
  var kmlLayer = new google.maps.KmlLayer({
    url: 'http://XXXXXXX.org/gliding/grid3.kml',
    suppressInfoWindows: false,
    map: map
  });
  google.maps.event.addListener(kmlLayer, 'click', function(kmlEvent) {
    var text = kmlEvent.featureData.name;
    showInContentWindow(text);
  });
  function showInContentWindow(text) {
    var sidediv = document.getElementById('content-window');
  }
}
google.maps.event.addDomListener(window, 'load', initialize);
    </script>
  </head>
  <body>
    <div id="map-canvas" style="width:100%; height:100%; float:left"></div>
    </body>
</html>

我想信息窗口还包含一个链接到与对象点击相同名称的页面。例如，如果用户点击KML图层中一个名为Tom的形状，信息窗口显示Tom点击这里。如果用户单击链接，他们将被带到www.XYZ.com/Tom。

我相信这很简单，但我是javascript的新手，不能让它工作。

这是一个hack而不是一个解决方案(这意味着谷歌可以改变一个属性名称，这将停止工作。

但是，给你

google.maps.event.addListener(kmlLayer, 'click', function(kmlEvent) {
    var text = kmlEvent.featureData.name;
    kmlEvent.featureData.infoWindowHtml += '<a href="' + kmlLayer.url + '">Click Here</a>';
    showInContentWindow(text);
});
相关文章：