Câu hỏi Google Maps Api v3 - getBounds không được xác định


Tôi đang chuyển từ v2 sang v3 google maps api và gặp vấn đề với gMap.getBounds() chức năng.

Tôi cần phải có được giới hạn của bản đồ của tôi sau khi khởi tạo của nó.

Đây là mã javascript của tôi:


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

Vì vậy, bây giờ nó thông báo cho tôi rằng gMap.getBounds() không định nghĩa được.

Tôi đã cố gắng để có được getBounds giá trị trong sự kiện nhấp chuột và nó hoạt động tốt cho tôi, nhưng tôi không thể có được kết quả tương tự trong sự kiện bản đồ tải.

GetBound cũng hoạt động tốt trong khi tài liệu đang tải trong API Google Maps phiên bản 2, nhưng nó không thành công trong V3.

Bạn có thể giúp tôi giải quyết vấn đề này không?


76
2018-05-14 07:59


gốc




Các câu trả lời:


Trong những ngày đầu của API v3, getBounds() phương pháp yêu cầu các lát bản đồ để tải xong cho nó để trả lại kết quả chính xác. Tuy nhiên bây giờ có vẻ như bạn có thể nghe bounds_changed sự kiện, được bắn ngay cả trước khi tilesloaded biến cố:

<!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>

122
2018-05-14 09:20



Đó là chính xác những gì tôi cần! thanks =). Nó giải quyết vấn đề của tôi. - DolceVita
cảm ơn bạn .... tôi ước gì tôi đã nhìn ở đây một giờ trước! - kinet
điều này rất hữu ích đối với tôi, tôi gần như lãng phí 2 giờ cho việc này - arjuncc
Cảm ơn bạn! Nó đã giúp tôi rất nhiều - user15
Hoàn hảo, cảm ơn! - maiis


Nó sẽ được làm việc, ít nhất theo tài liệu cho getBounds (). Tuy nhiên:

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

Xem nó hoạt động đây.


20
2018-05-14 09:27



Cảm ơn bạn đã liên kết này, hệ thống kiểm tra thực sự tốt - DolceVita
Đây sẽ là câu trả lời được chấp nhận. nhàn rỗi đang được gọi là cách sớm hơn là phải chờ đợi cho tất cả các gạch được nạp. - treznik
@treznik: Làm cách nào bạn xác định rằng idle sự kiện được kích hoạt trước tilesloaded biến cố? Đối với tôi, tilesloaded sự kiện liên tục cháy trước idle biến cố. - Daniel Vassallo
điều này thật đúng với gì mà tôi đã tìm kiếm - arjuncc
Đây là giải pháp tốt hơn nếu bạn chỉ cần chạy hàm một lần. - bbodenmiller


Tôi đã nói rằng giải pháp của Salman tốt hơn vì idle sự kiện được gọi sớm hơn tilesloaded một, vì nó chờ đợi cho tất cả các viên gạch được nạp. Nhưng trên một cái nhìn gần hơn, có vẻ như bounds_changed được gọi là thậm chí sớm hơn và nó cũng có ý nghĩa hơn, vì bạn đang tìm kiếm các giới hạn, phải không? :)

Vì vậy, giải pháp của tôi sẽ là:

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

14
2017-10-25 00:11



Khi câu hỏi này được hỏi, bounds_changed sẽ không làm việc, như getBounds() yêu cầu các viên gạch được nạp. 1 để đề xuất nó. Tôi sẽ cập nhật câu trả lời của mình. - Daniel Vassallo


Trong các bình luận khác ở đây, nó được khuyến khích sử dụng sự kiện "bounds_changed" trên "nhàn rỗi", mà tôi đồng ý với. Chắc chắn dưới IE8 mà kích hoạt "nhàn rỗi" trước khi "bounds_changed" trên máy dev của tôi ít nhất, để lại cho tôi với một tham chiếu đến null trên getBounds.

Tuy nhiên, sự kiện "bounds_changed" sẽ được kích hoạt liên tục khi bạn kéo bản đồ. Do đó, nếu bạn muốn sử dụng sự kiện này để bắt đầu tải điểm đánh dấu, nó sẽ nặng trên máy chủ web của bạn.

Giải pháp đa trình duyệt của tôi cho vấn đề này:

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

10
2018-01-11 11:32



Đây là phương pháp tôi sử dụng, vì những lý do tương tự :-) - oodavid


Vâng, tôi không chắc chắn nếu tôi quá muộn, nhưng đây là giải pháp của tôi bằng cách sử dụng gmaps.js cắm vào:

map = new GMaps({...});

// bounds loaded? if not try again after 0.5 sec
var check_bounds = function(){

        var ok = true;

        if (map.getBounds() === undefined)
            ok = false;

        if (! ok) 
            setTimeout(check_bounds, 500);
        else {
             //ok to query bounds here
              var bounds = map.getBounds();
        }   
    }

    //call it
    check_bounds();

1
2017-10-22 19:19