초보 지오로케이션 관련 질문좀 드립니다.

초보 지오로케이션 관련 질문좀 드립니다.

QA

초보 지오로케이션 관련 질문좀 드립니다.

본문

아래는 현재위치를 표시해주는 카카오맵 소스인데요

게시판 리스트를 사용자로부터 가까운 순으로 마커를 표시해 줄 수 있을까요?

참고로 게시판 분류에는 지역명 들어가구요 wr_1(상세주소) 입력란 입니다.

도움좀 부탁합니다. "꾸벅"

 

<div id="map" style="width:100%;height:454px;"></div>

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

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

// HTML5의 geolocation으로 사용할 수 있는지 확인합니다
 
if (navigator.geolocation) {
   
    // GeoLocation을 이용해서 접속 위치를 얻어옵니다
    navigator.geolocation.getCurrentPosition(function(position) {
       
        var lat = position.coords.latitude, // 위도
            lon = position.coords.longitude; // 경도
       
        var locPosition = new kakao.maps.LatLng(lat, lon), // 마커가 표시될 위치를 geolocation으로 얻어온 좌표로 생성합니다
         message = '<div style="padding:5px;">현재위치</div>'; // 인포윈도우에 표시될 내용입니다
          
        // 마커와 인포윈도우를 표시합니다
        displayMarker(locPosition, message);
           
      });
   
} else { // HTML5의 GeoLocation을 사용할 수 없을때 마커 표시 위치와 인포윈도우 내용을 설정합니다
   
    var locPosition = new kakao.maps.LatLng(33.450701, 126.570667),   
        message = 'geolocation을 사용할수 없어요..'
       
    displayMarker(locPosition, message);
}

// 지도에 마커와 인포윈도우를 표시하는 함수입니다

function displayMarker(locPosition, message) {

    // 마커를 생성합니다
    var marker = new kakao.maps.Marker({ 
        map: map,
        position: locPosition
    });
   
    var iwContent = message, // 인포윈도우에 표시할 내용
        iwRemoveable = true;

    // 인포윈도우를 생성합니다
    var infowindow = new kakao.maps.InfoWindow({
        content : iwContent,
        removable : iwRemoveable
    });
   
    // 인포윈도우를 마커위에 표시합니다
    infowindow.open(map, marker);
   
    // 지도 중심좌표를 접속위치로 변경합니다
    map.setCenter(locPosition);     
}

</script>

 

이 질문에 댓글 쓰기 :

답변 2

우선 위도와 경도를 저장해야하구요..

이 값을 이용해서 현재의 위도/경도와 가까운 데이터를 가져와야 합니다.

계산법은 아래 링크 참조

https://ko.martech.zone/calculate-great-circle-distance/

글 등록할때 따로 좌표를 넣고 해당 좌표를 가지고 거리를 구해서 리스트를 다시 정리하셔야 합니다. 해당을 질답으로 답을 구하기 힘드실거 같고 직접 힘드시면 제작의뢰를 이용해보세요.

답변을 작성하시기 전에 로그인 해주세요.
전체 98,861 | RSS
QA 내용 검색

회원로그인

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