v2에서 v3 Google지도 API로 전환 중이며 gMap.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);
alert(gMap.getBounds());
}
);
이제 gMap.getBounds()
정의되지 않은 것을 경고합니다 .
클릭 이벤트에서 getBounds 값을 얻으려고 시도했지만 잘 작동하지만로드 맵 이벤트에서 동일한 결과를 얻을 수 없습니다.
또한 getBounds는 Google Maps API v2에서 문서를로드하는 동안 제대로 작동하지만 V3에서는 실패합니다.
이 문제를 해결하도록 도와 주시겠습니까?
답변
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>
답변
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());
});
});
답변
모든 타일이로드 될 때까지 기다리기 때문에 idle
이벤트가 이벤트보다 일찍 호출 되기 때문에 Salman의 솔루션이 더 낫다고 말하고있었습니다 tilesloaded
. 하지만 자세히 살펴보면 bounds_changed
더 일찍 호출 된 것 같고 경계를 찾고 있기 때문에 더 의미가 있습니다. 🙂
그래서 내 해결책은 다음과 같습니다.
google.maps.event.addListenerOnce(gMap, 'bounds_changed', function(){
alert(this.getBounds());
});
답변
여기에있는 다른 의견에서는 “idle”보다 “bounds_changed”이벤트를 사용하는 것이 좋습니다. 이에 동의합니다. 확실히 IE8에서는 적어도 내 dev 컴퓨터에서 “bounds_changed”전에 “유휴”를 트리거하여 getBounds에서 null에 대한 참조를 남깁니다.
그러나 “bounds_changed”이벤트는지도를 드래그 할 때 계속 트리거됩니다. 따라서이 이벤트를 사용하여 마커로드를 시작하려면 웹 서버에서 무겁습니다.
이 문제에 대한 내 멀티 브라우저 솔루션 :
google.maps.event.addListenerOnce(gmap, "bounds_changed", function(){
loadMyMarkers();
google.maps.event.addListener(gmap, "idle", loadMyMarkers);
});
답변
글쎄, 내가 너무 늦었는지 확실하지 않지만 다음은 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();