diff --git a/apps/nowait-user/src/pages/waiting/boothMap/components/mapControls/CompassButton.tsx b/apps/nowait-user/src/pages/waiting/boothMap/components/mapControls/CompassButton.tsx index 0fd2b53b..bd236bac 100644 --- a/apps/nowait-user/src/pages/waiting/boothMap/components/mapControls/CompassButton.tsx +++ b/apps/nowait-user/src/pages/waiting/boothMap/components/mapControls/CompassButton.tsx @@ -1,4 +1,4 @@ -import { useRef } from "react"; +// import { useRef } from "react"; import MyLocation from "../../../../../assets/icon/myLocation.svg?react"; import { isCompassModeStore } from "../../../../../stores/mapStore"; import { useNavermaps } from "react-naver-maps"; @@ -13,7 +13,7 @@ const CompassButton = ({ const { isCompassMode, setIsCompassMode } = isCompassModeStore(); const navermaps = useNavermaps(); - const markerRef = useRef(null); + // const markerRef = useRef(null); const handleClick = async () => { if (!isCompassMode) { // 내 위치로 이동 @@ -21,42 +21,42 @@ const CompassButton = ({ setIsCompassMode(true); } else { // 나침반 모드 활성화 - if (typeof DeviceOrientationEvent !== "undefined") { - try { - // iOS의 경우 권한 요청 필요 - if ( - typeof (DeviceOrientationEvent as any).requestPermission === - "function" - ) { - const permission = await ( - DeviceOrientationEvent as any - ).requestPermission(); - if (permission !== "granted") return; - } + // if (typeof DeviceOrientationEvent !== "undefined") { + // try { + // // iOS의 경우 권한 요청 필요 + // if ( + // typeof (DeviceOrientationEvent as any).requestPermission === + // "function" + // ) { + // const permission = await ( + // DeviceOrientationEvent as any + // ).requestPermission(); + // if (permission !== "granted") return; + // } - window.addEventListener("deviceorientation", (event) => { - console.log("alpha:", event.alpha); - if (event.alpha != null && markerRef.current) { - const heading = 360 - event.alpha; - console.log(heading); - const marker = markerRef.current; - const icon = marker.getImage(); - if (icon) { - // 회전용 transform 적용 - const imgEl = document.querySelector( - `img[src="${(icon as any).src}"]` - ); - if (imgEl) { - imgEl.style.transform = `rotate(${heading}deg)`; - imgEl.style.transition = "transform 0.1s linear"; - } - } - } - }); - } catch (e) { - console.warn("Device orientation not available:", e); - } - } + // window.addEventListener("deviceorientation", (event) => { + // console.log("alpha:", event.alpha); + // if (event.alpha != null && markerRef.current) { + // const heading = 360 - event.alpha; + // console.log(heading); + // const marker = markerRef.current; + // const icon = marker.getImage(); + // if (icon) { + // // 회전용 transform 적용 + // const imgEl = document.querySelector( + // `img[src="${(icon as any).src}"]` + // ); + // if (imgEl) { + // imgEl.style.transform = `rotate(${heading}deg)`; + // imgEl.style.transition = "transform 0.1s linear"; + // } + // } + // } + // }); + // } catch (e) { + // console.warn("Device orientation not available:", e); + // } + // } setIsCompassMode(false); } };