Using Google Maps Javascript API V3, I have setup a map to pull data from a dynamically generated KML file. Here is the result: http://theevolvement.org/MapRetailers.php
In my code (copied below), I specified the zoom to 12 in my map's options. When the page loads, it starts out at that assigned zoom, but within about one second the map zooms out (and shifts its assigned center) to fit all of the plotted points.
We want to load the map with a specified zoom, not include all the plotted data. So any advice anyone can give as to what I'm doing wrong would be greatly appreciated. Thank you all!
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<link href="http://code.google.com/apis/maps/documentation/javascript/examples/default.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="//maps.googleapis.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
function initialize() {
var vegas = new google.maps.LatLng(36.1589862,-115.1723833);
var myOptions = {
zoom: 12,
center: vegas,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
var ctaLayer = new google.maps.KmlLayer('http://theevolvement.org/MapRetailers.php?getKML=1&t=<?=mktime()?>');
ctaLayer.setMap(map);
}
</script>
</head><body onload="initialize()">
<div id="map_canvas"></div>
</body>
WOO! I finally figured out the solution!
The KmlLayer function required another parameter, {preserveViewport: true}
var ctaLayer = new google.maps.KmlLayer('<?=$kmlURL?>', {preserveViewport: true});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With