예제와 같이 script 를 아래 주소를 이용해서 로딩하고나면,
//dapi.kakao.com/v2/maps/sdk.js?appkey={내 JS 앱키}
아래와 같은 kakao.maps의 값을 확인할 수 있습니다.
version: "4.1.8"
readyState: 2 … 등…
하지만 내부에는 Map을 비롯해 LatLng 와 같은 별도의 constructor 가 포함되지 않아서,
아래와 같이 kakao.maps.LatLng 를 인스턴스화 시키면 에러를 뱉어내고 있습니다.
라이브러리에 services, drawing, cluster 등을 추가하여 로딩을 해도 해결되지 않고 있습니다.
무엇을 어떻게 해야하는 것인가요?
var mapDiv = document.getElementById(‘map’); //지도를 담을 영역의 DOM 레퍼런스
var mapOptions = { //지도를 생성할 때 필요한 기본 옵션
center: new kakao.maps.LatLng(33.450701, 126.570667), //지도의 중심좌표.
level: 7 //지도의 레벨(확대, 축소 정도)
};
var map = new kakao.maps.Map(mapDiv, mapOptions); //지도 생성 및 객체 리턴
스크립트가 완전히 로딩이 된 후 지도를 생성하는지 확인이 필요해 보입니다.
만약 비동기로 지도를 생성하시려고 하는거라면 아래 링크도 함께 참고해주세요.
http://apis.map.kakao.com/web/documentation/#load_load
1개의 좋아요
결론적으로 말씀해주신 대로 로딩 문제는 맞는 것으로 확인 되었습니다.
php 를 이용한 프론트앤드 개발 중인데 해당 라이브러리는 include_once 와 같은 외부 페이지에서 include 형태로 별도의 페이지에서 해당 라이브러리를 php 단에서 추가하는 형태로 를 이용하여 로딩됩니다.
비동기적 로딩이 요구되는 상황은 아니었습니다.
공유해주신 링크는 확인해서 테스트까지 했으나,
테스트 결과는 위와 같이 include_once 와 같이 외부 페이지를 include 하는 형태에서는 load() 함수 자체가 구동 되지만 kakao.js 파일이 로딩되지 않은체로 load() 함수가 발핸되는 문제는 동일하게 발생됨을 확인했습니다.
-------- 최종 해결 방법 -------
sdk.js 파일을 로딩하는 를 include_once 와 같은 외부 include 페이지가 아닌 원본 페이지내에 포함시킴으로서 kakao.js 가 로딩됨을 확인했습니다.
ㅠㅠ 정확한 원인은 뭐라 말씀드리기가 어렵지만 해결되었습니다.
답변 감사합니다.
1개의 좋아요
