web-dev-qa-db-ja.com

どのようにしてクラスをリーフレットマーカーに追加しますか？

リーフレットマーカーにカスタムdivIconsを使用しています。クリックしたマーカーにボーダーを追加したいのですが、簡単なCSSをいくつか使用しています。

.selectedMarker {
border: 10px solid gold;
}

ただし、jQueryを使用した以下は機能しません。

$(marker).addClass('selectedMarker');

次に、Leaflet独自の addClass（）メソッド を使用してみました。私はそれを次の方法で使用しようと呼びました：

marker.addClass('selectedMarker');
L.addClass(marker, 'selectedMarker');
addClass(marker, 'selectedMarker');
DomUtil.addClass(marker, 'selectedMarker');

これらはどれも機能しません。マーカーにselectedMarkerクラスを追加するにはどうすればよいですか？

javascriptjqueryleaflet
20
yesman

マーカーにクラスを追加してそれを行いました

var marker = L.marker(loc);
marker.on('click', function() {
    $(marker._icon).addClass('selectedMarker');
}

そしてCSSを使用します

.leaflet-marker-icon.selectedMarker{
  //your css
}
20
r8n5n

1.0および0.7では、 L.DomUtil を使用して、DOM要素からクラスを削除することができます。

L.DomUtil.addClass(marker._icon, 'className');
L.DomUtil.removeClass(marker._icon, 'className');
19
bgeo

jQueryを使用せずに、

marker._icon.classList.add("className");
12
Mujtaba Kably