2014-12-03 114 views
14

我使用自定义divIcons作为我的Leaflet标记。我想添加一个边框任何标志我点击,用一些简单的CSS:如何将一个类添加到Leaflet标记?

.selectedMarker { 
border: 10px solid gold; 
} 

然而,与jQuery以下不工作:

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

于是我试图用宣传单的自己addClass() method。我试图通过以下方式呼叫使用它:

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

这些都不起作用。如何将selectedMarker类添加到我的标记?

+0

什么是$(标记)? – Cattla 2014-12-03 09:03:09

+0

jQuery。这不起作用,因为jQuery的目标是DOM元素,而不是JavaScript对象。 – ohyeah 2014-12-03 09:04:44

回答

15

我已通过添加类来标记与

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

完成它,然后使用CSS

.leaflet-marker-icon.selectedMarker{ 
    //your css 
} 
+0

很好,谢谢! – ohyeah 2014-12-03 09:10:14

8

而不使用jQuery,

marker._icon.classList.add("className"); 
+0

确认此作品,谢谢。这是我认为最好的方法。不幸的是'classList'在用户点击它之前一直未定义,所以在用这个方法创建它之后不能添加类。另外,对于那些使用传单的markercluster,它在'event.layer._icon'中。 – dtgq 2017-03-04 03:44:33

9

在1.0和0.7您可以使用L.DomUtil从DOM元素添加删除类:

L.DomUtil.addClass(marker._icon, 'className'); 
L.DomUtil.removeClass(marker._icon, 'className'); 
相关问题