google maps - How to embed a kml or kmz file in my webpage -


i need embed kml google earth map in webpage. followed this instructions, link code embed doesn't seem activated here.

i tryed followning code, shows simple map without informatons in kml file

<head> <title></title> <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 }      #google-map { height: 100% }      </style>  <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=my-key&sensor=false">  </script>  <script>     function initialize() {         var mapoptions = {             center: new google.maps.latlng(42.753633, 13.952404),              zoom: 10,             maptypeid: google.maps.maptypeid.satellite,             scrollwheel: false         }          var map = new google.maps.map(document.getelementbyid('google-map'), mapoptions);          var ctalayer = new google.maps.kmllayer({             url: 'poligono1.kml'         });          ctalayer.setmap(map);     }            google.maps.event.adddomlistener(window, 'load', initialize);  </script>   </head>  <body onload="initialize()">      <div id="google-map" class="google-map"></div>  </body> 

i put kml file in same folder of webpage. in advance helping me!!!

i think sample google developer useful

<!doctype html>     <html>       <head>         <style>           #map-canvas {             width: 500px;             height: 400px;           }         </style>          <script src="https://maps.googleapis.com/maps/api/js"></script>        </head>       <body>         <div id="map-canvas"></div>       <script>     /**      * @fileoverview sample showing capturing kml file click      *   , displaying contents in side panel instead of      *   infowindow      */      var map;     var src = 'https://developers.google.com/maps/tutorials/kml/westcampus.kml';      /**      * initializes map , calls function creates polylines.      */     function initialize() {       map = new google.maps.map(document.getelementbyid('map-canvas'), {         center: new google.maps.latlng(-19.257753, 146.823688),         zoom: 2,         maptypeid: google.maps.maptypeid.terrain       });       loadkmllayer(src, map);     }      /**      * adds kmllayer based on url passed. clicking on marker      * results in balloon content being loaded right-hand div.      * @param {string} src url kml file.      */     function loadkmllayer(src, map) {       var kmllayer = new google.maps.kmllayer(src, {         suppressinfowindows: true,         preserveviewport: false,         map: map       });       google.maps.event.addlistener(kmllayer, 'click', function(event) {         var content = event.featuredata.infowindowhtml;         var testimonial = document.getelementbyid('capture');         testimonial.innerhtml = content;       });     }      google.maps.event.adddomlistener(window, 'load', initialize);     </script>     </body>     </html> 

Comments

Popular posts from this blog

javascript - oscilloscope of speaker input stops rendering after a few seconds -

javascript - gulp-nodemon - nodejs restart after file change - Error: listen EADDRINUSE events.js:85 -

Fatal Python error: Py_Initialize: unable to load the file system codec. ImportError: No module named 'encodings' -