CODEWITHSUNDEEP
google-maps-api-3kmllayer
Ricardo Silva
Ricardo Silva

Reputation: 13

Cannot load KML file

Good Day,

Why I cannot load KML file made in My maps to my site ?

here is the code i'm using 

        map = new google.maps.Map(document.getElementById("mapa"), mapOptions),
        json = JSON.parse($.trim($('#json .content').html())).nodes,
        markers = [],
        centerControlDiv = document.createElement('div'),
        centerControl = new ControlesMapa(centerControlDiv, map);
        var ctaLayer = new google.maps.KmlLayer({
           url: 'http://www.santos.sp.gov.br/mapadeobras/sites/all/themes/mapadeobras/kml/bairros.kml',
           map: map
        });

when i tried with the file from example. It worked fine

var ctaLayer = new google.maps.KmlLayer({
          url: 'http://googlemaps.github.io/js-v2-samples/ggeoxml/cta.kml',
          map: map
        });

I have tested the kml file on google validator and it's ok. The kml file is public as I've read here in another post.

Please Help

Upvotes: 1

Views: 252

Answers (1)

CodeMonkey
CodeMonkey

Reputation: 23738

This works. Try specifying the center of the area of interest if it does not auto-jump to the region as defined in KML.

code snippet:

function initialize() {

  var location = new google.maps.LatLng(-23.954785,-46.348161);
  var mapOptions = {
   zoom: 11,
   center: location
  }
  var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

  var ctaLayer = new google.maps.KmlLayer({
url: 'http://www.santos.sp.gov.br/mapadeobras/sites/all/themes/mapadeobras/kml/bairros.kml',
map: map
  });
}

google.maps.event.addDomListener(window, 'load', initialize);
html,
body,
#map-canvas {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}
<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="map-canvas"></div>

Upvotes: 1

Related Questions