2010-05-14 3 views
72

Я переключаюсь с v2 на v3 на google maps api и получил проблему с функцией gMap.getBounds().Google Maps Api v3 - getBounds undefined

Мне нужно получить границы моей карты после ее инициализации.

Вот мой 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()); 
    } 
); 

Так что теперь он предупреждает меня, что gMap.getBounds() не определено.

Я попытался получить значения getBounds в событии click, и он отлично работает для меня, но я не могу получить одинаковые результаты в событии карты нагрузки.

Также getBounds отлично работает при загрузке документа в API Карт Google версии 2, но он не работает в V3.

Не могли бы вы помочь мне решить эту проблему?

ответ

118

В первые дни API v3 метод 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> 
+1

Это именно то, что мне нужно! спасибо =). Это решило мою проблему. – DolceVita

+0

спасибо .... Мне жаль, что я не посмотрел здесь час назад! – kinet

+0

это очень полезно для меня, я почти потерял 2 часа за это – arjuncc

18

Он должен работать, по крайней мере в соответствии с документацией для 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()); 
    }); 
}); 

Просмотреть работу here.

+0

Спасибо за эту ссылку, действительно хорошая тестовая система – DolceVita

+0

Это должен быть принятый ответ. idle вызывается раньше, чем ждать, пока все плитки будут загружены. – treznik

+0

@treznik: Как вы определили, что событие 'idle' запускается перед событием' patchloaded'? Для меня событие 'brokenloaded' постоянно срабатывает перед событием' idle'. –

14

Я говорил, что решение Салмана лучше, потому что событие idle называется раньше, чем tilesloaded, так как оно ожидает загрузки всех плиток. Но при более близком рассмотрении, кажется, bounds_changed называется еще раньше, и это также имеет больше смысла, поскольку вы ищете границы, не так ли? :)

Так что мое решение будет:

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

Когда этот вопрос был задан, 'bounds_changed' не работал бы, поскольку' getBounds() 'требовал, чтобы плитки были загружены. +1 за предложение. Я уточню свой ответ. –

9

В других комментариях здесь, он посоветовал использовать «bounds_changed» событие над «холостой ход», который я согласен. Конечно, в IE8, который запускает «простоя» до «bounds_changed» на моей машине, по крайней мере, оставляя мне ссылку на null на getBounds.

Событие «bounds_changed», однако, будет запускаться непрерывно, когда вы перетащите карту. Поэтому, если вы хотите использовать это событие для начала загрузки маркеров, это будет тяжело на вашем веб-сервере.

многосайтового решение браузера этой проблемы:

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

Это метод, который я использую по тем же причинам :-) – oodavid

1

Ну, я не уверен, если я слишком поздно, но вот мое решение с помощью gmaps.js плагин:

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(); 
Смежные вопросы