【JavaScript】LeafLetのマーカーを任意の画像に変換する方法

今後も使いそうな気がしたので、備忘録としてまとめ。
Web 地図のための JavaScript ライブラリ「Leaflet」でマップピンを任意の画像に変更する方法です。

Leaflet の公式サイトはこちらから。

Leaflet – a JavaScript library for interactive maps
https://leafletjs.com/

方法は、Leaflet 公式サイトの Docs の icon の項目を参考にしていただければと思います。
https://leafletjs.com/reference-1.4.0.html#icon

使い方は下記のとおり。

var myIcon = L.icon({
    iconUrl: '[マーカーの画像パス]',
    iconSize: [38, 95]  // アイコンサイズ
});
L.marker([50.505, 30.57], {icon: myIcon}).addTo(map);

マーカーを指定する処理のみを抜粋しています。
割愛しましたが、マーカーの影の画像や、クラス要素の名前も指定できるので、状況に応じて追加してください。
なお、必須項目は iconUrl のみです。

他にも、devIcon を利用する方法もあります。
画像のかわりに HTML 要素を指定できますので、IconFont を使用する場合にはこちらを使うのが良さそうです。
https://leafletjs.com/reference-1.4.0.html#divicon

var myIcon = L.divIcon({html: '[html要素]', className: '[クラス名]'});
L.marker([50.505, 30.57], {icon: myIcon}).addTo(map);

上記の Icon 同様に、マーカーを指定する箇所のみを抜粋していますので、それ以外は各自で実装してください。
指定できる項目は、Icon とほぼ同じですが、iconUrl の項目と、マーカーの影に関する項目は指定してあっても無視されるようなので、その点はご注意ください。

以上、Leaflet のマップマーカーを任意の画像 or HTML 要素に変更する方法でした。
調べたらすぐにヒットする情報ではありますが、まとめておくといつかの私が楽なのでまとめ。
どなたかの助けになれば幸いです。