카카오 api 사용 시 currentStyle null값 에러

지도/로컬 API에 대한 문의게시판입니다.

안녕하세요
api 가이드대로 localhost 도메인 등록 후 발급받은 appkey값을 통해 지도 api를 사용해 개발 중입니다.
그런데 크롬,익스 두 브라우저 모두에서

kakao.js:3 Uncaught TypeError: Cannot read property ‘currentStyle’ of null
at Oc (kakao.js:3)
at q.gb [as constructor] (kakao.js:31)
at q.lc [as constructor] (kakao.js:33)
at new q (kakao.js:42)
at index.html:19

이 같은 에러가 발생합니다. 어떤 현상인가요… 답부탁드립니다.

2개의 좋아요

자주 보는 에러인데요… :slight_smile:
보통 daum.maps.Map 객체를 생성할때 넣어주는 첫 번째 파라메터(Wrapper Element)가
HTMLElement 가 아닌 다른 값이 들어가 있을 확률이 큽니다.
이 값이 제대로 들어갔는지 확인해주시고
만약 이 문제가 아니라면 코드를 직접 첨부해서 다시 답글로 달아주세요.

2개의 좋아요

음… 첨부 파일이 코드 전체인건가요?
여는 tag랑 닫는 tag가 뭔가 안 맞는데요.

가급적 HTML document를 구성하는 필수 요소를 모두 작성해 주시는게 좋습니다.
아무리 브라우저가 유연하게 렌더링 해 준다고 해도 부작용을 피해갈 수는 없거든요.

1개의 좋아요

HTML 선언 순서때문에 그렇습니다.
브라우저가 HTML 파싱 이후, DOM트리를 구성하는 단계에서
<div id="map"/> 가 아직 생성되지 않았는데
상단에서 스크립트가 div#map 태그를 참조하기 때문에 찾지 못한거죠.
때문에 container를 console.log(container)로 찍어보시면 null값이 나올겁니다.
결국 원인은 제가 첫 번째 댓글 단 그대로 입니다.

Map 선언이 포함된 스크립트 태그를 body안쪽에, 그리고 div#map 태그 아랫쪽에 위치시키면 동작할겁니다.
만약 계속 태그 안에 스크립트를 넣으려면 스크립트 안쪽 내용을 window.onload 콜백으로 감싸주시면 됩니다.

http://apis.map.daum.net/web/guide/#start
이 가이드를 보시면 이해가 더 빠르실 거에요.

5개의 좋아요

감사합니다!!!@

1개의 좋아요

참고로 첨부해주신 코드에 appkey가 노출되어 있으니 첨부 삭제가 가능하면 삭제하시거나 댓글 자체를 지워주세요.