Leaflet｜北海道のマンホールカード一覧マップをつくってみた

Leafletを使って北海道のマンホールカード配布施設一覧マップをつくってみました。

やりたかったこと

１．俯瞰的にマンホールカードの配布場所を知りたい
効率的にマンホールカードをゲットしたい。

２．配布施設への経路情報を簡単に知りたい（検索したい）
地図アプリに From・Toを入れるのがめんどい。

３．配布施設の絞り込み
地図で俯瞰的に配布場所を確認したいけど、時にはピンポイントで絞り込みたい。

これは地図にマーカーをを立てることで解決しました。
簡単ですね♪

「付近への経路を表示」ボタンをタップすると、From を現在地、Toを目的地の緯度経度で設定し経路を検索します。

iOS系では、Apple純正の地図アプリで経路を検索します。
Android（iOS以外）では、Google Map で経路を検索します。

地図上に、配布施設（カード）ごとの選択リストを設置して、施設を選択できるようにしました。
デフォルトでは全施設が表示されるようになっています。

とこんな感じで実装しました。

配布施設は、下水道広報プラットホームを元に地図にマッピングしています。
現在、第9弾までの北海道のマンホールカードに対応しています。

つくってみると、Leafletのおかげで簡単に実装することができました。
北海道限定ではありますが、よかったら使ってみてください。