I have a really strange error that keeps causing my browser to just freeze when I try to resize a map to fit the markers I have placed on it.
My resize code for reference:
function sizeMap() {
// create a new bounds object to define the new boundry
var bounds = new google.maps.LatLngBounds();
// loop through each the string latlang values held in the latlng
// aray
for ( var i = 0; i <latlngArray.length ; i++) {
// create a new LatLng object based on the string value
var tempLatLng = new google.maps.LatLng(latlngArray[i]);
// extend the latlng bounds based on the new location
bounds.extend(tempLatLng);
}
// map.fitBounds(bounds); <== everything seems to work fine until this line is uncommented
}
Problem is I cant debug it properly using firebug because that freezes to! Any one got any ideas on what the problem may be?
Thanks in advance.
Update:
In answer to puckheads question the following code shows where the latlng array is populated to start with:
function geocodeAddress (address) {
var geocoder = new google.maps.Geocoder();
geocoder.geocode( {'address': address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
loadMarker(results[0].geometry.location,"Info here",address);
latlngArray.push(results[0].geometry.location); <== latlngs are first added here they are as a result of a call to the google geocode service with a standard string address.
} else {
alert("Geocode was not successful for the following reason: " +" "+ status);
}
});
}
The problem is as others have mentioned, that you try to create a LatLng object with another LatLng object as argument. It only accepts 2 or 3 arguments, where the two first are numbers. https://developers.google.com/maps/documentation/javascript/reference#LatLng
However you can entirely skip the part where you create a new LatLng object, and use the current one from your array inside the loop.
This fixes the problem: http://jsfiddle.net/y9ze8a1f/1/
function sizeMap() {
// create a new bounds object to define the new boundry
var bounds = new google.maps.LatLngBounds();
// loop through each the string latlang values held in the latlng
// aray
for ( var i = 0; i <latlngArray.length ; i++) {
// This is causing the issue, you can only create a LatLng with two separate latitude and longitude arguments
//var tempLatLng = new google.maps.LatLng(latlngArray[i]);
bounds.extend(latlngArray[i]);
}
map.fitBounds(bounds);
}
If you would want to create a new LatLng based on the old one though, you could do that by using the LatLng methods lat()
and lng()
http://jsfiddle.net/q7sh4put/
function sizeMap() {
// create a new bounds object to define the new boundry
var bounds = new google.maps.LatLngBounds();
// loop through each the string latlang values held in the latlng
// aray
for ( var i = 0; i <latlngArray.length ; i++) {
// create a new LatLng object based on the string value
var tempLatLng = new google.maps.LatLng(latlngArray[i].lat(), latlngArray[i].lng());
// extend the latlng bounds based on the new location
bounds.extend(tempLatLng);
}
map.fitBounds(bounds);
}
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