요즘 약국의 공공마스크 재고를 확인하는 API 를통해

많이들 만드시는 "공공마스크 재고" 페이지를 만들어봤습니다.

https://meteorkor.github.io/maskMap/

사실 퀄리티 좋은 맵들이 많아서 사실 불필요할 수 있지만

개인적으로 Map Api들도 활용해본적이 없기 때문에

추후 Map Api를 한번 사용해봐야지 했던터라

불필요할것 같지만 안해보기는 아쉬울것 같아 만들어 보았습니다.

(다음맵 선택 가능하지만, 대부분 다음Map을 사용하신것 같아 네이버맵 으로 만들어봤습니다.)

현재 토이 프로젝트를 목적으로 라즈베리파이 서버를 사용하고 있지만

"공공마스크 재고"를 위해서는 굳이 백엔드가 필요하지 않을것 같아

사실 html 페이지 하나만을 위해 웹서버를 띄우기는 조금 낭비 같아서

github page를 사용해서 html페이지를 띄웠고

덕분에 도메인도 자동으로 github.io을 달고 공개할 수 있었습니다.

생각날때 마다 조금씩 수정하고 있는데

당연한 내용이지만 하나씩 수정 내용을 남기려고 합니다.

1. 조회 API 호출은 "bounds_changed" 이벤트가 호출시

2. "bounds_changed" 마다 부르니 너무 API가 많이 불리니, API 호출시에는 "bounds_changed"가 불리더라도 API를 호출하지않도록 수정

3. 움직여서 API를 호출하더라도 marker를 중복으로 그리는 현상이 있으니, 중복 체크해서 그리지 않도록

4. API의 주어진 검색범위는 5km인데, 3km 로 고정 제공하다 zoom 정도에 따라 검색 범위를 수정하도록

5. zoom controller 를 화면에 추가

6. "bounds_changed"는 zoom만 변경되더라도 호출되고, 드래그를 하는 중에도 호출되기 때문에 "dragend" 이벤트로 변경

코드는 오픈되어있습니다.

물론.. 다듬어야 할 부분은 상당히 많습니다..^^;

https://github.com/Meteorkor/maskMap