2 마커 및 InfoWindow로지도를 채우는 방법

Question

지도에 마커를 약간 채울 필요가 있으며 그 중 하나에 정보 창이 필요합니다. 그리고이 모든 것들은지도 뷰포트 내부에 있어야합니다. 나는 왼쪽 InfoWindow는 상단의 경계, 오른쪽 상단 모서리와 2 개 마커를 얻기 위해이 코드를 사용하려고 해요 :

function calculateWaypointsBounds(attraction, destination, client, infoBox, map){ 

    const bounds = new google.maps.LatLngBounds(); 
    bounds.extend(new google.maps.LatLng(attraction.lat, attraction.lon)); 
    bounds.extend(new google.maps.LatLng(client.lat, client.lon)); 
    bounds.extend(new google.maps.LatLng(destination.lat, destination.lon)); 

    const div = infoBox.content_; 

    const projectionCoords = infoBox.getProjection().fromLatLngToContainerPixel(new google.maps.LatLng(attraction.lat, attraction.lon)); 
    const leftTop = new google.maps.Point(projectionCoords.x - div.offsetWidth/2, projectionCoords.y - 400); 
    const rightTop = new google.maps.Point(projectionCoords.x + div.offsetWidth/2, projectionCoords.y - 400); 
    const ltCoords = infoBox.getProjection().fromContainerPixelToLatLng(leftTop); 
    const rtCoords = infoBox.getProjection().fromContainerPixelToLatLng(rightTop); 

    bounds.extend(ltCoords); 
    bounds.extend(rtCoords); //InfoWindow always shows above marker, so i'm need only top left and top right corners. 



    return bounds; 
} 

을하지만 잘못 내 생각처럼 보인다. 어떻게해야합니까? infoWindow와 내 마커 중 2 개가 맵뷰 뷰포트 안에 있습니다.

Answer 1

var bounds = new google.maps.LatLngBounds(); 
for (var i = 0; i < markers.length; i++) { 
    bounds.extend(markers[i].getPosition()); 
} 

배열 (위의 : : 마커)에있는 모든 마커의 목록을 유지하십시오. 아래의 코드를 사용하여 맵 오브젝트에 적용 다음 루프의 모든 마커에 대한 귀하의 경계를 확장 유지 :

mapObject.fitBounds(bounds); 

이 자동으로지도의 모든 마커와 자신의 정보창에 맞게 축소 할 것입니다. 희망이 당신을 도울 것입니다 ....