보이는 모든 마커를 포함하도록 맵의 중심 / 설정 줌?

지도에 여러 개의 마커를 설정하고 있으며 확대 / 축소 수준과 중심을 정적으로 설정할 수 있지만 원하는 것은 모든 마커를 표시하고 가능한 모든 시장을 볼 수 있도록 확대 / 축소하는 것입니다.

사용 가능한 방법은 다음과 같습니다

setZoom(zoom:number)

과

setCenter(latlng:LatLng)

나도 setCenter여러 위치 또는 위치 배열 입력을 지원하지 않으며 setZoom이러한 유형의 기능이 있는가

이 fitBounds()방법 을 사용해야합니다 .

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

map.fitBounds(bounds);

문서 에서 developers.google.com/maps/documentation/javascript :

fitBounds(bounds[, padding])

매개 변수 :

`bounds`:  [`LatLngBounds`][1]|[`LatLngBoundsLiteral`][1]
`padding` (optional):  number|[`Padding`][1]

반환 값 : 없음

주어진 범위를 포함하도록 뷰포트를 설정합니다.
참고 :지도로 설정하면 display: none의 fitBounds기능으로지도의 크기를 읽고 0x0아무것도하지 않습니다 그러므로합니다. 지도가 숨겨져있는 동안 뷰포트를 변경하려면지도를로 설정 visibility: hidden하여지도 div의 실제 크기를 확인하십시오.

몇 가지 유용한 트릭으로 주어진 답변을 확장하려면 :

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

//center the map to a specific spot (city)
map.setCenter(center); 

//center the map to the geometric center of all markers
map.setCenter(bounds.getCenter());

map.fitBounds(bounds);

//remove one zoom level to ensure no marker is on the edge.
map.setZoom(map.getZoom()-1); 

// set a minimum zoom 
// if you got only 1 marker or all markers are on the same address map will be zoomed too much.
if(map.getZoom()> 15){
  map.setZoom(15);
}

//Alternatively this code can be used to set the zoom for just 1 marker and to skip redrawing.
//Note that this will not cover the case if you have 2 markers on the same address.
if(count(markers) == 1){
    map.setMaxZoom(15);
    map.fitBounds(bounds);
    map.setMaxZoom(Null)
}

업데이트 :
주제에 대한 추가 연구에 따르면 fitBounds ()는 비동기식이며 Fit Bounds를 호출하기 전에 정의 된 리스너로 Zoom 조작을 수행하는 것이 가장 좋습니다.
감사합니다 @Tim, @ xr280xr, 주제에 대한 더 많은 예 : SO : setzoom-after-fitbounds

google.maps.event.addListenerOnce(map, 'bounds_changed', function(event) {
  this.setZoom(map.getZoom()-1);

  if (this.getZoom() > 15) {
    this.setZoom(15);
  }
});
map.fitBounds(bounds);

배열의 크기는 0보다 커야합니다. 따라서 예기치 않은 결과가 발생합니다.

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

Google Map 개발자 기사MarkerClusterer 에 지정된대로 Google Map에 사용할 수있는 이 클라이언트 측 유틸리티가 있으며 사용법은 다음과 같습니다.

요청한 작업을 수행하는 방법에는 여러 가지가 있습니다.

• 그리드 기반 클러스터링
• 거리 기반 클러스터링
• 뷰포트 마커 관리
• 퓨전 테이블
• 마커 클러스터 러
• 마커 관리자

위의 제공된 링크에서 이에 대해 읽을 수 있습니다.

Marker Clusterer그리드 기반 클러스터링 을 사용하여 그리드를 원하는 모든 마커를 클러스터링 합니다. 그리드 기반 클러스터링은 맵을 특정 크기의 사각형으로 나누고 (각 줌에서 크기가 변경됨) 마커를 각 그리드 사각형으로 그룹화하여 작동합니다.

클러스터링 전

클러스터링 후

나는 이것이 당신이 찾고있는 것이기를 희망하며 이것은 당신의 문제를 해결할 것입니다 :)