Google Maps Api v3 - getBounds未定义

Question

Google Maps Api v3 - getBounds未定义

Dol*_*ita 81 javascript google-maps google-maps-api-3

我正在从v2切换到v3 google maps api并且遇到了gMap.getBounds()功能问题.

我需要在初始化后获取地图的边界.

这是我的javascript代码:


var gMap;
$(document).ready(

    function() {

        var latlng = new google.maps.LatLng(55.755327, 37.622166);
        var myOptions = {
            zoom: 12,
            center: latlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        gMap = new google.maps.Map(document.getElementById("GoogleMapControl"), myOptions);

        alert(gMap.getBounds());
    }
);

Run Code Online (Sandbox Code Playgroud)

所以现在它警告我gMap.getBounds()未定义.

我试图在click事件中获取getBounds值,它对我来说很好,但我无法在加载映射事件中得到相同的结果.

在Google Maps API v2中加载文档时,getBounds也能正常工作,但在V3中失败了.

你能帮我解决这个问题吗？

Answer 1

Dan*_*llo 132

在v3 API的早期阶段,该getBounds()方法需要地图图块完成加载才能返回正确的结果.但是现在看来你可以听到bounds_changed事件,甚至在tilesloaded事件发生之前就被触发了:

<!DOCTYPE html>
<html> 
<head> 
   <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
   <title>Google Maps v3 - getBounds is undefined</title> 
   <script src="http://maps.google.com/maps/api/js?sensor=false" 
           type="text/javascript"></script> 
</head> 
<body> 
   <div id="map" style="width: 500px; height: 350px;"></div> 

   <script type="text/javascript"> 
      var map = new google.maps.Map(document.getElementById("map"), {
         zoom: 12,
         center: new google.maps.LatLng(55.755327, 37.622166),
         mapTypeId: google.maps.MapTypeId.ROADMAP
      });

      google.maps.event.addListener(map, 'bounds_changed', function() {
         alert(map.getBounds());
      });
   </script> 
</body> 
</html>

Run Code Online (Sandbox Code Playgroud)

Answer 2

Sal*_*n A 20

它应该工作,至少根据getBounds()的文档.然而:

var gMap;
$(document).ready(function() {
    var latlng = new google.maps.LatLng(55.755327, 37.622166);
    var myOptions = {
        zoom: 12,
        center: latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    gMap = new google.maps.Map(document.getElementById("GoogleMapControl"), myOptions);
    google.maps.event.addListenerOnce(gMap, 'idle', function(){
        alert(this.getBounds());
    });
});

Run Code Online (Sandbox Code Playgroud)

看到它在这里工作.

Answer 3

tre*_*nik 14

我说萨尔曼的解决方案更好,因为idle事件被调用的时间早于tilesloaded一个,因为它等待加载所有的瓷砖.但仔细看看,它似乎bounds_changed更早被称为它更有意义,因为你正在寻找界限,对吧？:)

所以我的解决方案是:

google.maps.event.addListenerOnce(gMap, 'bounds_changed', function(){
    alert(this.getBounds());
});

Run Code Online (Sandbox Code Playgroud)

Answer 4

Alm*_*mer 11

在这里的其他评论中,建议使用"bounds_changed"事件而不是"idle",我同意这一点.当然在IE8下,至少在我的开发机器上的"bounds_changed"之前触发"idle",让我在getBounds上引用null.

但是,当您拖动地图时,将会连续触发"bounds_changed"事件.因此,如果您想使用此事件开始加载标记,那么您的网络服务器就会很重.

我的多浏览器解决这个问题的方法:

google.maps.event.addListenerOnce(gmap, "bounds_changed", function(){
   loadMyMarkers();
   google.maps.event.addListener(gmap, "idle", loadMyMarkers);
});

Run Code Online (Sandbox Code Playgroud)

归档时间：	15 年，9 月前
查看次数：	74147 次
最近记录：	9 年前