map.getBounds() странное поведение (Uncaught TypeError: невозможно прочитать свойство «getNorthEast» неопределенного)

Question

Я только начал входить в API Карт Google. Эту проблему легко понять, но я понятия не имею, как ее исправить. Это простой пример кода, который Google дает вам, за исключением предупреждения.

function initialize() { 
    var mapOptions = { 
     center: { lat: 43.680039, lng: -79.417076}, 
     zoom: 13 
    }; 
    map = new google.maps.Map(document.getElementById('map'), mapOptions); 
    google.maps.event.addListener(map, 'dragend', change); 
    google.maps.event.addListener(map, 'zoom_changed', change); 

    alert(map.getBounds().getNorthEast().lat()); 
} 
google.maps.event.addDomListener(window, 'load', initialize); 

map.getBounds(). GetNorthEast(). Лат() работает хорошо, когда она вызывается из любого другого события, за исключением нагрузки. Когда это событие карты, например масштабирование или перетаскивание, оно работает нормально, но когда я пытаюсь вызвать его здесь, я получаю сообщение об ошибке «Uncaught TypeError: невозможно прочитать свойство« getNorthEast »неопределенного». Кто-нибудь знает, что здесь или как я могу это исправить?

Answer 1

В API v3 Google Maps Javascript это событие на основе. Перед определением границ вам нужно дождаться первого события bounds_changed на карте.

var map; 
 
function initialize() { 
 
    var mapOptions = { 
 
    center: { 
 
     lat: 43.680039, 
 
     lng: -79.417076 
 
    }, 
 
    zoom: 13 
 
    }; 
 
    map = new google.maps.Map(document.getElementById('map'), mapOptions); 
 
    // google.maps.event.addListener(map, 'dragend', change); 
 
    // google.maps.event.addListener(map, 'zoom_changed', change); 
 
    google.maps.event.addListenerOnce(map, 'bounds_changed', function() { 
 
    alert(map.getBounds().getNorthEast().lat()); 
 
    }); 
 
} 
 
google.maps.event.addDomListener(window, 'load', initialize);

html, 
 
body, 
 
#map { 
 
    height: 100%; 
 
    width: 100%; 
 
}

<script src="https://maps.googleapis.com/maps/api/js"></script> 
 
<div id="map"></div>

Answer 2

Метод getBounds() требует, чтобы плитки карты заканчивали загрузку, чтобы возвращать правильные результаты. , но вы можете получить его, используя событие bounds_changed, которое запускается еще до загрузки плитки. так попробуйте использовать это:

google.maps.event.addListener(map, 'bounds_changed', function() { 
     alert(map.getBounds().getNorthEast().lat()); 
    }); 

для предотвращения предупреждений несколько раз, когда вы можете использовать google.maps.event.addListenerOnce