kakao map api 좌표 자동으로 어떻게 구해요?

kakao map api 좌표 자동으로 어떻게 구해요?

QA

kakao map api 좌표 자동으로 어떻게 구해요?

답변 1

본문

board 에서 view 질문이에요

kakao map api 좌표를 자동으로 enter: new kakao.maps.LatLng(33.451475, 126.570528),  어떻게 구해요?

 

 “부산광역시 강서구 명지국제12로15 1층” 이것뿐인데 이곳을 가지고 자동으로 어떻게  좌표를 xy로 어떻게 구하는 건가요? 

 

XY 값을 따로 받지 않고 자동으로 연동할 수 있게 하려고요 도와주세ㅠㅠ

 



<script>
    var mapContainer = document.getElementById('map'), // 지도의 중심좌표
        mapOption = {
            center: new kakao.maps.LatLng(33.451475, 126.570528), // 지도의 중심좌표
            level: 3 // 지도의 확대 레벨
        };

    var map = new kakao.maps.Map(mapContainer, mapOption); // 지도를 생성합니다

    // 지도에 마커를 표시합니다
    var marker = new kakao.maps.Marker({
        map: map,
        position: new kakao.maps.LatLng(33.450701, 126.570667)
    });

    // 커스텀 오버레이에 표시할 컨텐츠 입니다
    // 커스텀 오버레이는 아래와 같이 사용자가 자유롭게 컨텐츠를 구성하고 이벤트를 제어할 수 있기 때문에
    // 별도의 이벤트 메소드를 제공하지 않습니다
    var content = '<div class="wrap" style="padding-bottom: 100px;">' +
        '    <div class="info">' +
        '        <div class="title">' +
        '            카카오 스페이스닷원' +
        '            <div class="close" onclick="closeOverlay()" title="닫기"></div>' +
        '        </div>' +
        '        <div class="body">' +
        '            <div class="img">' +
        '                <img src="https://t1.daumcdn.net/localimg/localimages/07/mapapidoc/thumnail.png" width="73" height="70">' +
        '           </div>' +
        '            <div class="desc">' +
        '                <div class="ellipsis"><?php echo $view['wr_1']?></div>' +
        '                <div class="jibun ellipsis">전화번호 : <?php echo $view['wr_2']?></div>' +
        '            </div>' +
        '        </div>' +
        '    </div>' +
        '</div>';

    // 마커 위에 커스텀오버레이를 표시합니다
    // 마커를 중심으로 커스텀 오버레이를 표시하기위해 CSS를 이용해 위치를 설정했습니다
    var overlay = new kakao.maps.CustomOverlay({
        content: content,
        map: map,
        position: marker.getPosition()
    });

    // 마커를 클릭했을 때 커스텀 오버레이를 표시합니다
    kakao.maps.event.addListener(marker, 'click', function() {
        overlay.setMap(map);
    });

    // 커스텀 오버레이를 닫기 위해 호출되는 함수입니다
    function closeOverlay() {
        overlay.setMap(null);
    }
</script>

 

에서 이 부분 ? 

center: new kakao.maps.LatLng(33.451475, 126.570528), // 지도의 중심좌표

 

자동으로 가능한가요?

자동 가능하면 최종으로 어떻게 하면 되나요 알려 주세요 ^^

 

꼭 부탁드립니다 ^^

이 질문에 댓글 쓰기 :

답변 1

아래의 내용을 한번 참고해 보시겠어요?

 

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>지도에 마커 표시하기</title>
    <script type="text/javascript" src="//dapi.kakao.com/v2/maps/sdk.js?appkey=YOUR_APP_KEY"></script>
</head>
<body>
    <div id="map" style="width:100%;height:350px;"></div>

    <script>
        // 주소 변수 설정
        var address = "부산광역시 강서구 명지국제12로15 1층";

        // 카카오 지도 API 로드
        var mapContainer = document.getElementById('map'),
            mapOption = {
                center: new kakao.maps.LatLng(33.450701, 126.570667),
                level: 3
            };

        var map = new kakao.maps.Map(mapContainer, mapOption);

        // 주소-좌표 변환 객체 생성
        var geocoder = new kakao.maps.services.Geocoder();

        // 주소로 좌표를 검색
        geocoder.addressSearch(address, function(result, status) {
            // 정상적으로 검색이 완료됐으면
            if (status === kakao.maps.services.Status.OK) {
                var coords = new kakao.maps.LatLng(result[0].y, result[0].x);

                // 결과값으로 받은 위치를 마커로 표시
                var marker = new kakao.maps.Marker({
                    map: map,
                    position: coords
                });

                // 인포윈도우로 장소에 대한 설명을 표시
                var infowindow = new kakao.maps.InfoWindow({
                    content: '<div style="width:150px;text-align:center;padding:6px 0;">여기입니다!</div>'
                });
                infowindow.open(map, marker);

                // 지도의 중심을 결과값으로 받은 위치로 이동
                map.setCenter(coords);
            }
        });
    </script>
</body>
</html>

답변을 작성하시기 전에 로그인 해주세요.
QA 내용 검색
질문등록
filter #map ×
전체 14
© SIRSOFT
현재 페이지 제일 처음으로