2014-10-27 131 views
1

基本上,我試圖在我的網站上添加/顯示我的Google地球div上的KML文件。我打電話給我的文件「satellites.kml」。如何將Google地球KML文件添加到html iframe?

<!-- html code starts...--> 

<p><iframe 
     name="myKMLEarth" 
     src="/getrack/satellites.kml" 
     height="440" 
     width="100%" 
     frameborder="0" 
     scrolling="no"> 
</iframe></p> 

<!-- html code continues ...--> 

當頁面加載時,它下載我的KML而不是在iframe中打開它。我不應該使用src鏈接到KML文件嗎?任何意見,將不勝感激!先謝謝你!

+0

你想做什麼?以明文形式顯示.kml文件的聯繫人? – Bijan 2014-10-27 23:38:01

+0

我正在嘗試將我的KML圖層添加到網站上顯示的Google地球上。 – MadsterMaddness 2014-10-27 23:39:28

+1

你爲什麼使用iframe?你可以添加'satellites.kml'作爲一個新層。看到[這裏](http://stackoverflow.com/questions/17409598/toggle-multiple-kml-kml-layers-in-google-maps-api-v3)如何做別人 – Bijan 2014-10-27 23:42:47

回答

3

你必須使用谷歌地圖JavaScript API https://developers.google.com/maps/documentation/javascript/reference?hl=es

您必須將google.maps.KmlLayer附加到地圖上。

把API腳本在<head>

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&amp;sensor=false"></script> 

創建這樣一個div:

<div id="google-map" class="google-map"></div> 

然後,使用這個JS代碼</body>之前。設置您的緯度,經度和KML文件的路徑。

<script> 
    function initialize() { 
     var mapOptions = { 
      center: new google.maps.LatLng(YOUR_LAT,YOUR_LNG), //Set your latitude, longitude 
      zoom: 19, 
      mapTypeId: google.maps.MapTypeId.SATELLITE, 
      scrollwheel: false 
     } 

     var map = new google.maps.Map(document.getElementById('google-map'), mapOptions); // get the div by id 

     var ctaLayer = new google.maps.KmlLayer({ 
      url: 'PATH/TO/FILE.kml' // Set the KML file 
     }); 

     // attach the layer to the map 
     ctaLayer.setMap(map); 
    } 

    // load the map 
    google.maps.event.addDomListener(window, 'load', initialize); 
</script> 
1

您似乎需要在另一個應用程序或使用插件打開KML。瀏覽器不知道如何在iframe中顯示文件,因此只需下載它。 「許多應用程序都顯示KML,包括Google地球,Google地圖,Google地圖移動版,NASA WorldWind,ESRI ArcGIS Explorer,Adobe PhotoShop,AutoCAD和Yahoo! Pipes。」

我不100%明白你正在嘗試做的,所以我不能肯定,如果這是你在找什麼,但這個問題可能指向您在正確的方向:How to Embed KML files (Google Earth) into a website without the google gadget?

相關問題