[카카오맵] TypeError: kakao.maps.LatLng is not a constructor 해결

브라우저에서 제목과 같은 오류가 생성된다. 

LatLng 가 아직 생성되지 않았다는 것인데, 스크립트의 위치를 html 가장 아래 단으로 옮겨도 문제가 해결되지 않았다. 

var mapContainer = document.getElementById('map'), // 지도를 표시할 div 
    mapOption = { 
        center: new kakao.maps.LatLng(33.450701, 126.570667), // 지도의 중심좌표
        level: 3 // 지도의 확대 레벨
    };
    
	var map = new kakao.maps.Map(mapContainer, mapOption); 	//지도생성

서치해보니 카카오에서 명료한 해결책을 내놓았다. 

로드 함수라는게 있다는데, src에  autoload=false 추가하고 load 함수 안에 실행할 스크립트를 넣어주면 잘 뜬다. 

<script type="text/javascript" src="//dapi.kakao.com/v2/maps/sdk.js?appkey=(키값)&libraries=services&autoload=false"></script>	
<script>
kakao.maps.load(function() {
	var mapContainer = document.getElementById('map'), // 지도를 표시할 div 
    mapOption = { 
        center: new kakao.maps.LatLng(33.450701, 126.570667), // 지도의 중심좌표
        level: 3 // 지도의 확대 레벨
    };
</script>

 

출처-아래 링크

https://apis.map.kakao.com/web/documentation/#load_load