1

I am making a map where I have the KML load and the markers load on the same canvas in which I want the boundary to be however big the markers even though the kml is on the canvas. I'm using this in conjunction with php so there's a bit of php in the code but nothing to special besides entering information for variables. 

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">  
  jQuery(document).ready(function($) {
      if ($('#map_canvas').length != 0) {
                    var myLatlng = new google.maps.LatLng(45.266438, -93.233225);
                    var myOptions = {
                      zoom: 4,
                      center: myLatlng,
                      mapTypeId: google.maps.MapTypeId.ROADMAP
                    }
                    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

                    var bounds = new google.maps.LatLngBounds();

                    var kmlLayer = new google.maps.KmlLayer('<?php bloginfo('template_url'); ?>/includes/delivery-maps/mansettisdel.kml', { map: map });

                var jsongeo = <?php echo(json_encode($geo_json)); ?>;               
                $.each(jsongeo, function(index, value) {  
                        var latlng = new google.maps.LatLng(value.lat,value.lng);
                        var marker = new google.maps.Marker({
                            position: latlng, 
                            map: map,
                            title:"Hello World!"
                            }); 
                        bounds.extend(latlng);
                    map.fitBounds(bounds);  

                    });                 

                    }    

    });
</script>

here is the var_dump of the json that I am looping through the lat and longitude.

string(617) "[{"type":"delivery","lat":"45.341969","lng":"-93.277657","date":"2011-07-11"},{"type":"delivery","lat":"45.005360","lng":"-93.323738","date":"2011-07-12"},{"type":"delivery","lat":"45.319408","lng":"-93.202446","date":"2011-07-12"},{"type":"delivery","lat":"45.131786","lng":"-93.216576","date":"2011-07-13"},{"type":"delivery","lat":"44.804131","lng":"-93.166885","date":"2011-07-13"},{"type":"delivery","lat":"45.119965","lng":"-93.287727","date":"2011-07-13"},{"type":"delivery","lat":"42.358433","lng":"-71.059776","date":"2011-07-13"},{"type":"delivery","lat":"34.195915","lng":"-84.507317","date":"2011-07-13"}]"

Now I'm not having issues with the markers going through but just the bounds. I don't know if there is something other I would have to do with the lat,long but I read up on this a ton and can't find a thing.

Here is what is showing up.
What shows up

Here is what I would like to show up. What I want to show up

Even though the KML is on the map I would like the markers to be the bounds. Is there something that google maps does that sets it to the KML or do I have the bounds done incorrectly? I notice it goes to the bounds view and then RIGHT to the KML view.

Kara
  • 6,115
  • 16
  • 50
  • 57
Dan
  • 183
  • 3
  • 14

1 Answers1

1

Try adding the option preserveViewport: true to the KML options so it reads:

var kmlLayer = new google.maps.KmlLayer('<?php bloginfo('template_url'); ?>/includes/delivery-maps/mansettisdel.kml', { 
  map: map,
  preserveViewport: true
});

That should stop it zooming it into the KML bounds.

http://code.google.com/apis/maps/documentation/javascript/reference.html#KmlLayerOptions

Dave Folan
  • 13
  • 2