(Django) 위도/경도로 범위 필터링하기

Overview

• 우선 위도, 경도를 기반으로 5km 반경의 범위 값을 구하는 Function 구현
• Cookie 값으로 정보를 가져와 필터링 하는 View 구현
• 현재 위치 정보를 가져와 Cookie에 저장하는 Template 구현

App/views.py - getLatLngBound

# ------------------------------------------------------------------
# FunctionName : getLatLngBound
# Description  : 위도/경도로 범위 값을 구하는 함수
# ------------------------------------------------------------------
import math
def getLatLngBound(lat, lng):
  # 5km 구간
  lat_change = 5 / 111.2
  lng_change = abs(math.cos(lat * (math.pi / 180)))
  bounds = {
    "lat_min": lat - lat_change,
    "lng_min": lng - lng_change,
    "lat_max": lat + lat_change,
    "lng_max": lng + lng_change
  }
  return bounds

App/views.py - LocationListPage

# ------------------------------------------------------------------
# ViewName    : LocationListPage
# Description : 쿠키 값으로 지역 정보 리스트를 가져오는 View
# ------------------------------------------------------------------
@login_required
def LocationListPage(request):
  lat = request.COOKIES['latitude']
  lng = request.COOKIES['longitude']

  LC = getBoundsFromLatLng(float(lat), float(lng))
  list = Model.objects.filter(
    Q(lat__range=[LC['lat_min'], LC['lat_max']]) & 
    Q(lng__range=[LC['lon_min'], LC['lon_max']])
  )
  return render(request, 'LocationList/LocationListPage.html', {
      'list' : list,
    })

templates/LocationList/LocationListPage.html

<!-- 제이쿼리 쿠키 -->
<script src='/static/Base/js/jquery.cookie.js'></script>
<script>
// 현재 위치를 가져오는 getPosition 프로미스 생성
var getPosition = function (options) {
  return new Promise(function (resolve, reject) {
    var options = {
    enableHighAccuracy: true,
    maximumAge: 0,
    timeout: 10000
  }
    navigator.geolocation.getCurrentPosition(resolve, reject, options);
  })
}
// getPosition 프로미스 실행
// 결과값이 있을 경우 쿠키에 정보를 저장하고, 없을 경우 Error를 Log에 찍는다
getPosition()
  .then((position) => {
    $.cookie("latitude", position.coords.latitude, { path: '/' })
    $.cookie("longitude", position.coords.longitude, { path: '/' })
  })
  .catch((err)=> {
    console.log(err)
  })
</script>