Google Maps API에 대해 여러 핀을 중앙에 배치하는 방법

나는 이것을 짧게 할 것이다!



이것은 많은 수의 위치로 시작하고 위도와 경도가 있는 경우 작동합니다.

이 프로젝트에서는 React로 작업했기 때문에 도우미 함수를 사용하여 위의 항목에서 센터를 구문 분석하고 맵 구성 요소에 전달합니다.

let centerMath = [0, 0];
locations.map((place) => {
    centerMath[0] += place.latitude;
    centerMath[1] += place.longitude;
}
centerMath[0] = centerMath[0] / locations.length;
centerMath[1] = centerMath[1] / locations.length;
setCenter({
    lat: centerMath[0],
    lng: centerMath[1],
});


그런 다음 지도 구성 요소에 상태를 전달하고 여기에서 사용합니다(제 경우에는 GoogleMap 구성 요소).

<GoogleMap
zoom={10}
center={center}
options={settings}
>


이것을 직접 스캐폴딩하십시오.

우리는 기본적으로 모든 lats를 더하고 자릿수로 나누는 것입니다. longs도 마찬가지입니다. 0, 10 및 0, 20에 두 개의 위치가 있는 경우 중심점은 0, 15가 됩니다. 너무 복잡하지는 않지만 누군가에게 도움이 될 수 있다고 생각했습니다!

건배
-엘리엇/빅 시스

좋은 웹페이지 즐겨찾기