为什么不在Google地图上显示kml文件?

时间:2018-07-12 09:02:09

标签: google-maps kml show

我想在Google地图上看到一个kml文件(例如此文件:https://drive.google.com/file/d/1LavoJL0iux65Zqu0yH0tFfu4WSOgKjZj/view?usp=sharing)。我已经在Windows 10中运行了IIS,并将上述文件放在了本地主机中。根据{{​​3}},我使用了以下代码来查看我的kml文件。我将src更改为“ Displaying KML instruction”。但是我看不到谷歌地图上的点。我不知道我怎么了我确实在该站点中进行了很多搜索,但是找不到任何答案。有没有人可以帮助我?感谢您的帮助。谢谢

<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
    <title>KML Click Capture Sample</title>
    <style>
      html, body {
        height: 370px;
        padding: 0;
        margin: 0;
        }
      #map {
       height: 360px;
       width: 300px;
       overflow: hidden;
       float: left;
       border: thin solid #333;
       }
      #capture {
       height: 360px;
       width: 480px;
       overflow: hidden;
       float: left;
       background-color: #ECECFB;
       border: thin solid #333;
       border-left: none;
       }
    </style>
  </head>
  <body>
    <div id="map"></div>
    <div id="capture"></div>
    <script>
      var map;
      var src = 'http://localhost/kmlfiles/SamenPoint.kml'

      function initMap() {
        map = new google.maps.Map(document.getElementById('map'), {
          center: new google.maps.LatLng(34.658, 50.977),
          zoom: 2,
          mapTypeId: 'terrain'
        });

        var kmlLayer = new google.maps.KmlLayer(src, {
          suppressInfoWindows: true,
          preserveViewport: false,
          map: map
        });
        kmlLayer.addListener('click', function(event) {
          var content = event.featureData.infoWindowHtml;
          var testimonial = document.getElementById('capture');
          testimonial.innerHTML = content;
        });
      }
    </script>
      <script async defer
              src="https://maps.googleapis.com/maps/api/js?key=My_API_Key&callback=initMap">
      </script>
  </body>
</html>

0 个答案:

没有答案