diviconでleafletのマーカーにhtmlタグを使用する

差分

このページの2つのバージョン間の差分を表示します。

この比較画面へのリンク

次のリビジョン
前のリビジョン
diviconでleafletのマーカーにhtmlタグを使用する [2021/11/19 02:48] – 作成 133.11.144.12diviconでleafletのマーカーにhtmlタグを使用する [Unknown date] (現在) – 削除 - 外部編集 (Unknown date) 127.0.0.1
行 1: 行 1:
-====== diviconでleafletのマーカーにhtmlタグを使用する ====== 
  
-Leafletで地図上にマーカーをプロットする際には、以下のようにマーカーを追加できる。 
- 
-    L.marker([lat,lon]).addTo(map); 
- 
-デフォルトのアイコンは、''L.Icon.Default''オブジェクトが与えられる。(青色のピン)  
- 
-ここでマーカーのアイコンを画像などに置き換えたいときは、''icon''オプションで指定してあげればよい。 
- 
-    L.marker([lat,lon], { icon: myIcon }).addTo(map); 
- 
-ここで''icon''オプションに与えるアイコンを''div''タグで作成したいときは、''L.divIcon''オブジェクトを作成し、''icon''オプションに与えてあげればよい。''div''タグにクラスを与えたいときはclassNameオプションで指定する。 
- 
-    var myIcon = L.divIcon({className: 'my-div-icon'}); 
-    // you can set .my-div-icon styles in CSS 
-     
-    L.marker([50.505, 30.57], {icon: myIcon}).addTo(map); 
- 
-divタグの中身にHTMLタグを入れたいときは、htmlオプションで引数にHTMLタグを文字列として渡してあげればよい。 
- 
-    var myIcon = L.divIcon({ html: HTMLタグ }); 
  • diviconでleafletのマーカーにhtmlタグを使用する.1637290106.txt.gz
  • 最終更新: 2021/11/19 02:48
  • by 133.11.144.12