소셜독

react-native-maps 줌 state로 관리하기

2hakjoon 2022. 6. 13. 19:05
const [mapZoom, setMapZoom] = useState<number>(0)
<RNMapView
	onRegionChangeComplete={region => {
    setMapZoom(
      Math.ceil(Math.log(360 / region.longitudeDelta) / Math.LN2),
    );
  }}
>
Math.ceil(Math.log(360 / region.longitudeDelta) / Math.LN2),

 

수식을 통해 현재 화면내에 그려진 지도의 영역을 통해서 줌레벨을 계산해 낼수 있다. user가 지도를 줌 할때, 해당 이벤트가 동작하고, 줌 된 상태의 레벨을 계산하여 state에 반영한다.