안녕하세요!
지도 api에서 좌표 추출 후 ajax로 컨트롤러에 넘기는 형식을 사용하려고 하는데 계속 좌표값이 null로 뜹니다.
혹시 어느 부분에서 잘못된 것인지 확인 가능하실까요?
<script>
var mapContainer = document.getElementById('map'), // 지도를 표시할 div
mapOption = {
center: new daum.maps.LatLng(37.537187, 127.005476), // 지도의 중심좌표
level: 5 // 지도의 확대 레벨
};
//지도를 미리 생성
var map = new daum.maps.Map(mapContainer, mapOption);
//주소-좌표 변환 객체를 생성
var geocoder = new daum.maps.services.Geocoder();
//마커를 미리 생성
var marker = new daum.maps.Marker({
position: new daum.maps.LatLng(37.537187, 127.005476),
map: map
});
//위도, 경도 저장
var lat = '';
var lng = '';
function sample5_execDaumPostcode() {
new daum.Postcode({
oncomplete: function(data) {
var addr = data.address; // 최종 주소 변수
// 주소 정보를 해당 필드에 넣는다.
document.getElementById("sample5_address").value = addr;
// 주소로 상세 정보를 검색
geocoder.addressSearch(data.address, function(results, status) {
// 정상적으로 검색이 완료됐으면
if (status === daum.maps.services.Status.OK) {
var result = results[0]; //첫번째 결과의 값을 활용
// 해당 주소에 대한 좌표를 받아서
var coords = new daum.maps.LatLng(result.y, result.x);
// 지도를 보여준다.
mapContainer.style.display = "block";
map.relayout();
// 지도 중심을 변경한다.
map.setCenter(coords);
// 마커를 결과값으로 받은 위치로 옮긴다.
marker.setPosition(coords)
}
});
}
}).open();
}
// 지도가 이동, 확대, 축소로 인해 중심좌표가 변경되면 마지막 파라미터로 넘어온 함수를 호출하도록 이벤트를 등록합니다
kakao.maps.event.addListener(map, 'center_changed', function() {
lat = '';
lng = '';
// 지도의 레벨을 얻어옵니다
var level = map.getLevel();
// 지도의 중심좌표를 얻어옵니다
var latlng = map.getCenter();
//지도 위도
lat = latlng.getLat();
//지도 경도
lng = latlng.getLng();
});
console.log(lat);
console.log(lng);
//DB에 보내는 ajax
function addressAdd(){
$.ajax({
url: "/business/new",
type: "post",
data: {
lat : lat,
lng : lng
},success: function (){
console.log("성공!")
},error: function (){
console.log("오류")
}
})
};
</script>