2

对 Google 混搭有点陌生。我在我们的网络服务器 (http://www.madisonareampo.org/maps/BRT_National.kmz) 上有一个 KML,可以在 Google 地图上绘图。

我有一个谷歌地图混搭,我想要一个信息窗口通过点击事件显示 KML 描述字段的内容。KML 文件是使用 ArcGIS 从地理数据库中导出的。

当我单击 KML 文件中的标记时,没有返回任何内容。

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Google Maps JavaScript API v3 Example: Street View Layer</title>
    <link href="/maps/documentation/javascript/examples/default.css" rel="stylesheet">
    <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBvkXCNOcIGLKZVgFtIykSQEbEk0db1XxY&sensor=false">
    </script>
    <script>

      function initialize() {
        var BRT = new google.maps.LatLng(40.380028, -93.440917);
        var mapOptions = {
          center: BRT,
          zoom: 3,
          overviewMapControl: true,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        var map = new google.maps.Map(
            document.getElementById('map_canvas'), mapOptions);

        var layer= new google.maps.KmlLayer('http://www.madisonareampo.org/maps/BRT_National.kmz',
          { suppressInfoWindows: true,
            map: map });

        google.maps.event.addListener(layer, 'click', function(kmlEvent) {
          showInContentWindow(kmlEvent.featureData.description);
        });

        function showInContentWindow(text) {
          var content = "<div style='margin-left:-20px;border:2px dotted #897823;'>" + text +  "</div>";
          var infowindow = new google.maps.InfoWindow({
            content: content 
          })
        }

        var panoramaOptions = {
          position: BRT,
          pov: {
            heading: 34,
            pitch: 10,
            zoom: 1
          }
        };
        var panorama = new google.maps.StreetViewPanorama(document.getElementById('pano'),panoramaOptions);
        map.setStreetView(panorama);
      }
    </script>
  </head>
  <body onload="initialize()">
    <div id="map_canvas" style="width: 650px; height: 400px"></div>
    <div id="pano" style="position:absolute; left:660px; top: 8px; width: 650px; height: 400px;"></div>
  </body>
</html>
4

1 回答 1

2

InfoWindows需要一个position属性,您必须调用open(map)它才能将其绑定到地图。这是您的代码的工作版本:

google.maps.event.addListener(layer, 'click', function(kmlEvent) {
  showInContentWindow(kmlEvent.latLng, kmlEvent.featureData.description);
});

function showInContentWindow(position, text) {
  var content = "<div style='margin-left:-20px;border:2px dotted #897823;'>" + text +  "</div>";
  var infowindow = new google.maps.InfoWindow({
    content: content, 
    position: position
  })
  infowindow.open(map);
}
于 2012-12-12T09:20:48.863 回答