안녕하세요? 오류에 대해 질문드리고자 글을 올립니다.
평소에는 페이지가 잘 로딩되지만, 10번중 1~4번정도 부분적으로만 로드가되며, 지도는 로드가 되지 않습니다.
때때로 이렇게 오류가 나지도 않고, 맵도 로드하지 못하여 질문드립니다.
다른 글도 올렸는데, 비슷하지만 독립적인 문제인것 같아 따로 글을 올렸습니다.
혹시몰라 이 로그도 남깁니다.
오류가 날 때는 NaN이 뜨면서, 아래 페이지처럼 오류가 납니다.
링크로 이동 -> 카카오맵 오류에 대해 질문드립니다
창 크기를 조절하면 지도가 다시 그려집니다…
(위의 링크와 같은 오류가 발생했을때는 창을 조절해도 지도가 다시 그려지지 않습니다.)
어떤 해결책이 있을까요?
먼저 지도의 로드 문제를 해결한 다음 polygon 오류를 잡아야 될 것 같습니다.
지도 창 크기를 변경할 때 다시 그려지는 것은
resize 이벤트 발생 시 map.relayout()을 호출하기 때문인데요.
지도 객체 선언하기 전에 디버깅을 해서 div 스타일이 잘 들어가 있는지 확인 부탁드리고,
지도가 모달 창이나 탭으로 띄어지는 구조이거나 disply: none; → disply: block; 으로 변하는 구조라면
지도가 보이는 시점에 relayout()을 호출해야 합니다.
유사 질문에 대한 이전 답변들도 참고해주세요.
https://devtalk.kakao.com/t/topic/67269/2
https://devtalk.kakao.com/t/topic/47622/2
https://devtalk.kakao.com/t/topic/44357/4
https://devtalk.kakao.com/t/kakao-map-api/103167/2
리액트를 사용하는데, 먼저 지도의 중심좌표를 클라우드에서 불러서 맵을 로드합니다.
클라우드에서 불러올 때, 가끔씩 중심좌표가 undefined가 되었을때 렌더링함을 확인하였습니다.
렌더링하는 타이밍이 정말 미묘하게 늦을때가 있었던 모양입니다.
그래서 랜덤하게 맵 로드가 안되었던 것 같습니다.
또한 지도가 조금만 나오는 문제도 말씀해주신 map. relayout() 함수로 해결하였습니다.
이제 지도가 로드되지 않는 현상은 해결되었습니다.
이 문제가 사라지니, NaN문제도 사라졌습니다. 감사합니다!!
그런데 한자기 문제가 생겼습니다.
지도가 조금만 나올 때, 다시그리도록 relayout()을 사용하여 지도를 그리면, 지도의 위치가 달라지는 때가 있습니다.
맵 위치가 달라질 이유는 별로 없다고 생각하는데…
다른 글들을 보면서 추측되는 것은, CSS때문에 맵 위치가 달라지는것인지, 아니면
제가 모르는 창크기변경이 있는것인지 확인중에 있습니다.
답변으로 드린 첫 번째 링크 확인해보시면
크기가 변경되었기 때문에 위치도 다시 설정해야 합니다.
이전 지도의 중심과 레벨 값을 갖고 있다가
relayout 호출 후 지도 중심을 재설정해주세요.
크기를 변경하는 부분이 없다고 생각하는데, 맵 로드중에 그냥 크기가 변경될 수도 있나요?
항상 그러면 무언가 문제가 있겠거니 하겠는데
10번 리프레쉬하면 1~2번정도만 그렇게 재현되니 수정하기가 참 난해하네요.
크기를 변경하는 부분이 없다는 게 어떤 말씀이신가요?
지도의 크기가 변경돼서 relayout()을 호출한 게 아닌가요?
아직 로드 관련 문제가 완전히 해결되어 보이지 않습니다.
지도를 생성하는 시점 문제 같아 보이기도 하는데요.
지도를 로드하는 시점에 dom객체가 잘 생성되었는지, 스타일이 들어가 있는지 확인해보시고,
react로 개발 중이라면 아래 링크도 함께 확인해주세요.
https://devtalk.kakao.com/t/react-api/43110
https://devtalk.kakao.com/t/react-router-redux/52344
lea.ju님의 말이 맞는것 같습니다.
지도가 생성될때 뭔가 문제가 있는 것 같습니다.
감사합니다…ㅠㅠ 이렇게 적극적으로 문제해결에 도움을 주시다니 감동이에요.
잘 해결해보겠습니다.
결국 두번째 해결방안인 setTimeout() 메서드로 지연시간을 주었습니다.
클라우드 데이터 통신이 늦을때도 있기 때문인지
아니면 로드하는데 오래걸려서 그런지
500ms나 줘야 완전히 버그가 없어졌습니다.
차차 줄여가야겠습니다. 감사합니다.
안녕하세요.
몆일째 지도를 load못하고 있는데 맵 로드 부분만 리엑트 코드 공유해주실수 있나요?
보여주신다면 너무 감사하겠습니다…
제 노트북에서는 랜더링 해준 좌표만큼주고 맴도 잘뜨고 오버레이도 잘뜹니다 근데 다른 사람 노트북에서 저의코드를 그대로 복사한후 실행 시켜는데 뭔가 랜더링이 잘 안불러져오는 상황 같이 위쪽에 만 지도 가뜨고 나머지 부분들은 짤려서 나옵니다 창을 늘리니까 맵이 나오긴하는데 랜더링한 좌표값 정확하게 안뜨고 다른곳에 랜더링이 되어있는 상황이 나옵니다 혹시 이런 오류 아시는지 ㅠㅠ