map.fitBounds(边界）导致浏览器冻结

map.fitBounds(bounds) causing browser to freeze

本文关键字：浏览器 冻结 fitBounds 边界 map      更新时间：2023-09-26

我有一个非常奇怪的错误，当我试图调整地图大小以适应我在地图上放置的标记时，这个错误一直导致我的浏览器冻结。

我的调整大小代码供参考：

 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 
        }

问题是我无法使用firebug正确调试它，因为它冻结为！有人知道可能是什么问题吗

提前谢谢。

更新：

在回答冰球问题时，以下代码显示了从何处填充latlng数组：

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);
                }
            });
        }

正如其他人所提到的，问题是您试图用另一个LatLng对象作为参数来创建LatLng。它只接受2或3个参数，其中前两个参数是数字。https://developers.google.com/maps/documentation/javascript/reference#LatLng

但是，您可以完全跳过创建新LatLng对象的部分，并在循环中使用数组中的当前对象。

这修复了问题：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);
}

如果你想在旧的基础上创建一个新的LatLng，你可以使用LatLng方法lat()和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);
}

据我所知，您不能从单个字符串参数创建LatLng对象。如果你有一个"lat，lng"形式的字符串，那么在创建LatLng对象之前将它们分开。你的循环内部看起来是这样的：

        var tempLatLng = latlngArray[i].split(',');
        bounds.extend(new google.maps.LatLng(tempLatLng[0], tempLatLng[1]));

有一个神奇的位置可以完全冻结谷歌地图。lat: any, lng: -90。你所能做的就是省略这些值，如下所示：

let lng = position.lng();
if (lng > -90 - 0.001 && lng < -90 - 0.001) {
  lng = -90 - 0.001;
}
bounds.extend(
  new google.maps.LatLng(position.lat(), lng)
);

为谷歌地图创建问题https://issuetracker.google.com/issues/280958696.

您不会从字符串创建新的LatLng。它是由两个数字创建的，尽管看起来也有两个字符串可以工作，一个用于纬度，另一个用于经度。一个字符串不起作用。

所以你可以说new google.maps.LatLng(-25.363882, 131.044922)，甚至new google.maps.LatLng('-25.363882', '131.044922')，但不能说new google.maps.LatLng('-25.363882, 131.044922')因此，您需要向新的google.maps.LatLng传递两个单独的值，但似乎只传递了一个。

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

根据更新的代码，您根本不需要创建tempLatLng。您的数组已经包含LatLng对象，因此您应该能够在for循环中说出bounds.extend(latlngArray[i])。。。

使用计时器：

var Timer="";
    $(window).resize(function() {
        clearInterval(Timer);
        run_timer();
    });
    function run_timer() {
        Timer = setInterval(function(){sizeMap();}, 1500);
    }
    function sizeMap() {
        clearInterval(Timer);
        // 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 
    }
相关文章：