口罩地圖

不願侷限於 junior，也要用自己的一份力量為台灣做一些事

一、使用技術

Leaflet 地圖框架

Openstreetmap 圖資

L.icon.pluse 圖標插件

HTML5 定位功能

MarkerClusterGroup 圖標統合功能

二、DEMO

DEMO

三、簡介

此為使用原生 JavaScript 製作的口罩地圖，功能包括

使用者定位功能
模糊搜尋藥局地址
搜尋劣藥局會依口罩數量由多而少排列
點選搜尋列的藥局，地圖會將畫面移置該藥局
設定身分證尾碼提示買口罩的日期
畫面 RWD 自適應

四、畫面介紹

- 地圖依縮放改變細節

- 自動定位使用者位置功能

- 身分證尾碼辨識今天是否可以買口罩

- 模糊搜尋並顯示口罩數量

- 查看地圖上藥局資訊

更多功能查看請上 DEMO