Google지도 API V3 메서드 fitBounds ()

Google지도 API V3 메서드 fitBounds ()

---

지도를 렌더링하는 코드가 있습니다.

function initialize() {
    var myOptions = {
      center: new google.maps.LatLng(45.4555729, 9.169236),
      zoom: 13,
      mapTypeId: google.maps.MapTypeId.ROADMAP,

panControl: true,
mapTypeControl: false,
panControlOptions: {
            position: google.maps.ControlPosition.RIGHT_CENTER
        },
zoomControl: true,
zoomControlOptions: {
    style: google.maps.ZoomControlStyle.LARGE,
    position: google.maps.ControlPosition.RIGHT_CENTER
},
scaleControl: false,
streetViewControl: false,
streetViewControlOptions: {
    position: google.maps.ControlPosition.RIGHT_CENTER
            }
        };
    var map = new google.maps.Map(document.getElementById("mapCanvas"),
        myOptions);



var Item_1 = new google.maps.LatLng(45.5983128 ,8.9172776);

var myPlace = new google.maps.LatLng(45.4555729, 9.169236);

var marker = new google.maps.Marker({
    position: Item_1, 
    map: map});

var marker = new google.maps.Marker({
    position: myPlace, 
    map: map});

var bounds = new google.maps.LatLngBounds(myPlace, Item_1);
map.fitBounds(bounds);

    }

두 지점이 25km에서 떨어져 있어도이 결과를 얻습니다.

더 높은 수준의 확대 / 축소를 렌더링하고 싶습니다.

이렇게

fitBounds () 메서드를 사용합니다.

    var bounds = new google.maps.LatLngBounds(myPlace, Item_1);
    map.fitBounds(bounds);

당신의 지원에 감사드립니다

---

이것은 LatLngBounds()두 개의 임의의 점을 매개 변수로 취하지 않고 SW 및 NE 점을 취하기 때문에 발생합니다.

.extend()빈 경계 객체에 메서드 사용

var bounds = new google.maps.LatLngBounds();
bounds.extend(myPlace);
bounds.extend(Item_1);
map.fitBounds(bounds);

http://jsfiddle.net/gaby/22qte/ 에서 데모

---

LatLngBounds(남서쪽, 북동쪽) 순서의 점으로 정의되어야합니다. 포인트는 그 순서가 아닙니다.

특히 포인트가 확실히 그 순서가 될지 모르는 경우 일반적인 수정 사항은 빈 경계를 확장하는 것입니다.

var bounds = new google.maps.LatLngBounds();
bounds.extend(myPlace);
bounds.extend(Item_1);
map.fitBounds(bounds);

API는 경계를 정렬합니다.

---

위에서 제안한대로 LatLngBounds를 구축하고 있지만 설명하는 것과 동일한 문제가 있습니다. 문제는 일이 비동기 적이며 map.fitBounds()잘못된 시간에 호출 하면 Q와 같은 결과가 남을 수 있다는 것입니다. 내가 찾은 가장 좋은 방법은 다음과 같은 유휴 핸들러에 호출을 배치하는 것입니다.

google.maps.event.addListenerOnce(map, 'idle', function() {
    map.fitBounds(markerBounds);
});

---

 var map = new google.maps.Map(document.getElementById("map"),{
                mapTypeId: google.maps.MapTypeId.ROADMAP

            });
var bounds = new google.maps.LatLngBounds();

for (i = 0; i < locations.length; i++){
        marker = new google.maps.Marker({
            position: new google.maps.LatLng(locations[i][1], locations[i][2]),
            map: map
        });
bounds.extend(marker.position);
}
map.fitBounds(bounds);

참고 URL : https://stackoverflow.com/questions/10268033/google-maps-api-v3-method-fitbounds