320x100
먼저 유저 키워드 기능을 구현하기 위해 saveKeyword 함수를 saveData 로 변경하고 위치 정보도 함께 가져왔다.
position 파라미터를 가져와서 문자열로 변환 후 같이 넘겨준다. 매핑 주소도 data로 바꿨다.
컨트롤러에서는 키워드 저장을 위한 savePosition함수를 호출해준다. 매개변수는 id와 position이다.
서비스 객체에 위치를 저장하기 위한 로직을 만든다. 키워드를 저장하기 위한 로직과 완전히 같다.
이렇게 구성하고 검색을 시도한 뒤 DB를 살펴보면
이런 식으로 좌표정보가 저장되어 있다. (위도, 경도)
이를 가져와서 실제로 지도에 넣기 위한 코드이다. 일단 그냥 가져오게 되면 "(위도, 경도)" 의 형태인 문자열이기 때문에, split을 통해 위도와 경도를 분리해주고, 위도는 두번째 글자부터(괄호 제외), 경도는 첫번째 글자부터 마지막에서 두번째 글자를 substr을 이용해서 떼어낸 뒤 Number로 형변환한다.
이를 moveMap 함수에 넣어주면 지도 이동이 완료된다.
그리고 '내 위치 가져오기'를 여러번 누를 시 마커가 계속 중복해서 생성되는 이슈가 있었는데, marker를 전역 변수로 선언하고 해당 마커가 이미 맵에 존재하는지 확인하는 코드를 작성하여 해결하였다.
베포 전에 앞으로 할 것들 (예정)
- DB를 MySQL로 변경하기
- 네이버 로그인 기능 추가하기
- 뷰 영역 개선하기
'Projects > matjipfind' 카테고리의 다른 글
네이버 로그인 API 등록 (0) | 2021.01.24 |
---|---|
중복 코드 제거, MySQL 연동 (0) | 2021.01.22 |
Ajax를 이용한 최근키워드 실시간 DB저장 기능 (0) | 2021.01.20 |
Google 로그인 기능과 DB 제작 (0) | 2021.01.18 |
내 위치 직접선택 기능, 최대 검색 거리, 네이버 검색 기능 (0) | 2021.01.16 |
댓글