여분필드값으로 카카오 지도 보이려면

여분필드값으로 카카오 지도 보이려면

QA

여분필드값으로 카카오 지도 보이려면

본문

글쓰기에서 지도검색 후 선택 방식 말고

여분필드 가령 w_9 값 입력만으로

글보기에서 카카오 지도 보여줄 수 있을까요?

view 페이지 코드 부탁드립니다.

 

이 질문에 댓글 쓰기 :

답변 2

wr_9 에 주소를 입력하고..

그 주소로 지도에 표시할 수 있습니다.

https://apis.map.kakao.com/web/sample/addr2coord/

 

wr_9 를 어떻게 넣으면 될까요?

------------------------------------

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);

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

// 주소로 좌표를 검색합니다
geocoder.addressSearch('제주특별자치도 제주시 첨단로 242', 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);
    }
});

주소 값으로 지도보이기 도움주셔서 고맙습니다~
지도 밑에 로드뷰도 보이게 하려는데
https://apis.map.kakao.com/web/sample/
둘러보아도 잘 모르겠네요 ㅜㅜ

여분필드 wr_9 값으로 보이는 지도 밑으로
로드뷰를 보이고 싶은데
코드를 어떤 것을 넣으면 될까요?

아 말씀처럼 지도 스크립트를 두개 넣으면 되겠군요.
그런데 카카오 지도 예제 페이지에서
일반 지도는 주소(여분필드)로 장소표시하기 스크립트가 있는데
로드뷰는 주로(여분필드)만으로 보이도록하는 스크립트 예제가 없네요.

카카오 지도 API 사용하기 (openai.com)


<script>
    function initMap() {
        var mapContainer = document.getElementById('map');
        var mapOptions = {
            center: new kakao.maps.LatLng(37.5665, 126.9780),
            level: 8
        };
        var map = new kakao.maps.Map(mapContainer, mapOptions);
        var w_9 = 123.456; // 여기에 w_9 값을 받아온 값으로 할당
        // w_9 값을 이용하여 적절한 좌표로 설정
        var markerPosition = new kakao.maps.LatLng(w_9, /*다른좌표*/); // w_9 값을 사용하여 좌표 생성
        // 마커 생성
        var marker = new kakao.maps.Marker({
            position: markerPosition
        });
        // 마커를 지도에 표시
        marker.setMap(map);
    }
    window.onload = function () {
        initMap();
    };
</script>
 

<script>
var coordinates = w_9.split('.'); // `.`로 구분된 좌표 값을 배열로 분리
var latitude = parseFloat(coordinates[0]); // 위도
var longitude = parseFloat(coordinates[1]); // 경도
var markerPosition = new kakao.maps.LatLng(latitude, longitude); // 좌표 생성
</script>
답변을 작성하시기 전에 로그인 해주세요.
전체 101
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT