Leaflet は広く使われているWeb地図のためのJavaScriptライブラリである。
ためしで、地図を表示してみた。
これでページ上部のようなMAPを表示することができる。
表示する地図の種類に関しては
21行目
'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png'
の部分を
を参考に変更することができる。
それに併せてコピーライト部分も変更の必要あり
attribution: 'Map data © OpenStreetMap',
のタイルを使用する場合は、APIキーを取得して
https://tile.thunderforest.com/cycle/{z}/{x}/{y}.png?apikey=取得したAPIキー
と指定する必要がある。