<div data-role="content">
<div id="map" style="width: 100%; height: 500px;"></div>
</div>
이 코드안에 map을 추가하니 이런식으로 로드가 되네요ㅠㅠ
console을 확인해보니
이렇게 뜨네요ㅠㅠ
혹시 해결할 방법이 있나요?ㅠ
경고문구랑 상관 없는 현상이며
해당 영역의 width/height 스타일을 미리 지정하지 않고
무언가를 눌렀을 경우 지도가 보여지는 상황이면
레이아웃 사이즈 변경이 모두 끝난 이후에
map.relayout();
을 호출하셔야 합니다.
api script를 그대로 가져와서 사용하였는데 map.relayout();을 호출해도 똑같이 뜨네요ㅠㅠ
특정한 인터렉션이 있다거나 클릭한 뒤에 지도가 나타나는 상황인가요?
넵 위치보기 라는 버튼으로 페이지 이동후 보여주는 상황입니다
이게… 음…
지도가 저렇게 나오는 경우는 대부분
지도 영역의 레이아웃이 채 잡히기 전이라서 그렇습니다.
apis.map.kakao.com 샘플에서는 잘 나오는 코드를 쓰신거잖아요.
그런데 저렇게 나온다는 것은 지도영역이 아닌 페이지 코드의 다른 부분에 영향을 받은 것입니다.
이 상황은 전체 코드를 보거나, 페이지를 직접 확인해 봐야 알 수 있습니다.
지도를 호출한 시점에서 data-role="content" 영역의 width 값이 몇인지 확인해 보세요.
1개의 좋아요
content영역에 따로 설정되어 있는건 없습니다 혹시 몰라 설정해보았지만 바뀌는 건 없었습니다
음… 뭔가 이상하긴 한데요 -_-;
좌 하단에 축척 표시도 안되고
외부에서 확인 가능한 페이지 URL이 있나요?
버튼을 클릭 했을때 지도를 생성하셔야 합니다. 미리 생성해 두면 안되고요.
미리 생성해 두고 싶으시면…
버튼을 눌렀을 때,
setTimeout(function() {
map.relayout()
map.setCenter(new kakao.maps.LatLng(37.564047, 126.973784))
}, 100);
이렇게 setTimeout을 사용하여 호출하시는게 나을 것 같네요.
그리고 relayout을 호출하시고 지도 중심을 다시 지정해 주셔야 합니다.