레스토랑 <-> 사용자 위치 거리 구하기

사용자 위치와 레스토랑 사이에 거리를 구하여 가까운 순으로 정렬하는 기능을 개발해야 했다. 

우선 레스토랑 Data에는 도로명 주소는 존재하지만 위치 정보는 따로 존재하지 않아 위치 정보를 입력해야만 했다. 도로명주소에서 제공하는 DB 데이터들이 존재하는데 그 중에 도로명 주소 DB가 존재한다. 도로명 주소 DB에는 도로명 주소 별 UTM-K 좌표계 기반 좌표를 제공한다. 따라서 이를 활용하면 위치 정보를 매핑시켜줄 수 있다.

 

가장 먼저 수행해야 할 과정을 정리하자면 

1. 레스토랑 정보를 DB에 입력 시킨 후 
2. 도로명 주소 DB의 좌표 정보를 DB에 입력 시킨다. 
3. 그 후에 레스토랑 정보와 도로명 주소를 매핑시킨다.

 

이제 레스토랑의 좌표를 모두 입력하였다. 

 

거리를 구해보자. 보통 사용자의 위치 정보를 가져오는 경우 gps 좌표를 가져오게 되는데 이는 WGS 좌표계이다.  레스트랑 좌표는 UTM-K 좌표이기 때문에 거리를 구하기 위해서는 변환이 필요하다. 좌표 변환은 Proj4js 라이브러리를 활용해서 구하면 된다.

 

        if('geolocation' in navigator) {
            navigator.geolocation.getCurrentPosition((position => {

                Proj4js.reportError = function(msg) { alert(msg); }
                Proj4js.defs['GRS80'] = '+proj=tmerc +lat_0=38 +lon_0=127.5 +k=0.9996 +x_0=1000000 +y_0=2000000 +ellps=GRS80 +units=m +no_defs';
                Proj4js.defs['WGS84'] ='+proj=longlat +ellps=WGS84 +datum=WGS84 +no_defs';

                var GRS80 = new Proj4js.Proj('GRS80');
                var WGS84 = new Proj4js.Proj('WGS84');

                var utmk = new Proj4js.Point(position.coords.longitude, position.coords.latitude);
                Proj4js.transform(WGS84, GRS80, utmk);

                document.cookie = "location=" + utmk.x + "|" + utmk.y;
            }));
        }

 

자 이제, 사용자 위치 정보를 UTM-K로 변환하였으니 맘껏 거리 정보를 구하면 된다. 

 

최종적으로 로직을 정리하자면 

1회성
레스토랑 도로명 주소와, 도로명 주소 좌표 정보를 매핑하여 좌표 정보를 구한다. 
사용자 위치 정보를 UTM-K 좌표계로 변환하여 쿠키에 저장한다.

for(모든 식당에 대하여 반복한다.)
		1. 현재위치 ↔  레스토랑 위치 계산

거리를 이용한 오름차순 정렬

 

거리 구하기 끝!