//dapi.kakao.com/v2/maps/sdk.js 지도 미노출 이슈

[bcw0318]

안녕하세요 지도 API 관련 문의 드립니다.

//dapi.kakao.com/v2/maps/sdk.js?appkey=javascript키
위와 같이 웹에서 지도 라이브러리를 호출하고 있습니다.

허나 지정한 div 영역에 지도가 노출되지 않습니다.
div에 지도가 그려졌고 드래그 액션도 개발자 도구에서 모니터링이 됩니다.
그런데 정작 지도 이미지가 보이지 않네요.

기 등록된 문의글의 경우를 봤을 때

1. 현재 등록된 앱 도메인은 www이 붙지 않습니다.
2. 부여받은 javascript key 를 통해 라이브러리를 웹에서 호출하고 있습니다.
3. ‘A parser-blocking, cross site (i.e. different eTLD+1) script, http://t1.daumcdn.net/mapjsapi/js/main/4.0.10/kakao.js, is invoked via document.write.’ 경고 문구는 실제 지도 호출 시 영향을 주지 않는다곤 하지만 일단 보이고 있습니다.
4. 지도 API를 호출하며 API 호출 횟수는 매번 카운팅이 되지만 API 에러가 발생한 적이 단 한차례도 확인되지 않습니다.

해결방안이 있다면 공유 부탁드립니다.

감사합니다.

[erin.lee]

안녕하세요.

우선 에러 로그 상에서는 deactivated 된 앱키 사용으로 인한 에러 로그 이외에는 정상적인 호출로 보여지고 있습니다.

언급하신 바와 같이 등록한 도메인이 http://xxx.com 한개만 되어 있는 것으로 확인 되는데요.
www 유무는 다른 도메인으로 판단 되므로,
www 케이스가 포함된 도메인에 대해서도 등록 후 재확인 해보시기 바랍니다.

감사합니다.

[bcw0318]

안녕하세요. 답변 감사드립니다.

www 포함된 도메인을 추가로 등록 후 테스팅 결과 동일한 현상이 발생합니다.
스크립트 콘솔 에러나 API 에러는 잡히지 않습니다.
해결방안이 있다면 가이드 부탁드립니다.

또한 API 호출과 동시에 실시간으로 모니터링 할 수 있는 방법이 있을까요?

감사합니다.

[doji.doo]

스크린샷 상으로 봤을 때,
스크립트는 인증을 올바르게 거친 후 정상적으로 로딩 되었습니다.

network탭에서 지도 타일 이미지를 제대로 받았는지 확인해 보세요.
대략 저정도 크기면 9개 정도 받아왔어야 정상입니다.

그냥 회색화면만 뜨는건 좀 이상하긴 하네요.
페이지에 선언된 CSS를 한 번 살펴보세요.
div, img 와 같이
기본 설정을 위해 태그 이름에 등록한 CSS 중,
지도 이미지를 띄우는데 방해되는 요소가 있을 수 있습니다.
혹은 상위에서 선언된 CSS가 영향을 주고 있을 수도 있어요.

모달로 띄우는 경우에는 모달창이 보였을 때의 CSS가 모두 정상적으로 적용된 상태에서 지도 객체를 선언해야 정상적으로 보여집니다.
만약 모달창이 보이지 않는 상태에서 지도 객체를 미리 선언해두고
모달창을 보여주기위해 스타일을 변경하는 경우라면
map.relayout(); 을 호출하여 지도객체에게 스타일이 변경되었으니 다시 레이아웃을 잡으라고 알려주어야 합니다.

http://apis.map.daum.net/web/sample/mapRelayout/
예제를 확인해보세요.