안녕하세요. naver map api를 사용하는 도중 에러를 해결하지 못하여 여쭤봅니다.
브라우저에서 동작시 발생하지는 않는 에러가 app화면(웹뷰) 테스트를 위해서 브라우저의 개발자 모드에서 app 사이즈로 테스트하는 경우 아래 에러가 발생합니다.
혹시 어디가 문제인지 알려주시면 감사하겠습니다!!
아래는 작성한 코드의 일부입니다. streetlayer 클릭시 effect가 동작하게 되어있습니다.
export default function NaverPanoMap() {
const { naver } = window;
const { mapState, mapDispatch } = useMap();
const { panoMap, panoItem } = mapState;
const mapRef = useRef();
useEffect(() => {
if (mapRef.current && !panoMap) {
const pano = new naver.maps.Panorama(mapRef.current, {
position: panoItem,
pov: {
pan: -135,
tilt: 0,
fov: 100,
},
flightSpot: false,
})
new naver.maps.Event.addListener(pano, "pano_status", (e)=>{
if(e === naver.maps.PanoramaStatus.ERROR){
alert('test');
} else {
mapDispatch({
type: 'SET_PANO_MAP',
payload: pano,
});
}
});
}
}, [mapRef, panoMap, naver, panoItem, mapDispatch]);
return (
<div id="pano" className={styles['pano-on']} ref={mapRef} style={{ width: '100%', height: '100vh' }}>
<div className={styles['pano-close']} onClick={panoClose}>
<Button variant='float' status='primary' icon={IoClose} onClick={() => window.scrollTo({left: 0, top : 0, behavior: 'smooth'})}/>
</div>
</div>
);
}
