Google Maps KML Layer won't Zoom

Question

I have an embedded Google Map using API V3 but I cannot get it default Zoom to anything other than 1.

My JS in the head is:

            var map1;
            var src1 = 'https://latitude.google.com/latitude/apps/badge/api?user=8963899225283336226&type=kml';
            function initialize1() {
                map1 = new google.maps.Map(document.getElementById('map-canvas'), {
                zoom: 7,
                mapTypeId: google.maps.MapTypeId.TERRAIN
              });
              loadKmlLayer1(src1, map1);
            } 

            google.maps.event.addDomListener(window, 'load', initialize1);

            function loadKmlLayer1(src1, map1) {
              var kmlLayer1 = new google.maps.KmlLayer(src1, {
                suppressInfoWindows: false,
                clickable: true,
                preserveViewport: false,
                map: map1
              });
            }

The HTML is just the map-canvas div, nothing else. Looking at some of the threads on here it look like its something to do with detecting the viewport and resetting the bounds.

I found a thread that suggested adding something like:

            google.maps.event.addListener(kmlLayer1, 'defaultviewport_changed', function() {
            var bounds = kmlLayer1.getDefaultViewport();
            map.setCenter(bounds.getCenter());
            })

but it made no difference. I'm by no means a JS expert and whilst I mostly understand what is going on in most of the code above, I'm not advanced enough to improvise or even understand where it should be placed.

I'm sorry I cant get an example working in Fiddle; the div just shows empty. The KML loads fine its just the default zoom level I cant get to work. I want it to be zoomed out rather zoomed all the way in, which appears to be the default. — user2205626

sobelito sobelito · Accepted Answer · 2013-11-20T20:53:48

Thanks Molle.

I enhanced to this and it works:

google.maps.event.addListener(kmlLayer, 'status_changed', function () {
  console.log('kml loaded:');
  google.maps.event.addListenerOnce(map, 'zoom_changed', function () {
    console.log('zoom_changed:');
    map.setZoom(7);
    map.setCenter(new google.maps.LatLng(0, 0));
  });
});

Google Maps KML Layer won't Zoom

2 Answers