CSV 음식점 데이터 를 네이버 지도 상 마커로 구현하기

개인 프로젝트를 위해서 계속 네이버 지도 API 를 파고 또 팠다. 

그 중에서도 내가 원하는 기능을 만들기 위해서 

https://navermaps.github.io/maps.js.ncp/docs/tutorial-marker-viewportevents.example.html

NAVER Maps API v3

이 예제를 계속 뜯어봤고  

food_data.CSV

0.04MB

 

 

 

 

위에 있는 음식점 데이터를  아래 그림처럼 마커에 추가할수 있게 했다. 원래 한 9천개 정도의 음식점이 있었는데 

이걸 다불러오면 로딩 엄청 오래걸려서 일단 100개 정도만 추가해서 구현했다. 

원래는  유투브 강의가 있으면 따라 해볼려했는데 자바 스프링부트로 강의한것을 못찾아서 생각나는대로 해봤다.

 

일단 위도와 경도는 음식 데이터에서 가져올수 있으므로  타임리프 기능을 통해서  위도와 경도를 다 갖고 오면된다.

그리고 네이버가 제공해주는 코드를 수정해서  그 코드에 위도와 경도를 for 문을 통해서 추가해주면 위에 그림처럼  그 위도 경도에 따라서 마커가 추가되게한다.  

 

이제 앞으로는 내가 현재 위치한 곳 주변 음식점만 뜨게 하고 데이터를 엄청 많이 추가해보는 단계까지 해봐야겠다.