Question

我希望通过设置className来设置geojson功能的样式。如果直接放在这样的功能上，这种方法非常好：

L.geoJson(geojson, {
    onEachFeature: function (feature, layer) {
        layer.setStyle({className: 'grid-cell'});
    }
}).addTo(map);

使用.css文件中定义的样式

path.grid-cell{
  stroke-opacity: 1;
  stroke: #444;
  fill: #aaa;
}

但是，如果在功能的事件回调中添加不，它会工作：

L.geoJson(geojson, {
    onEachFeature: function (feature, layer) {
        layer.on('click', function(e){
          this.setStyle({className: 'grid-cell'});
          this.bringToFront();
        });
    }
}).addTo(map);

令人惊讶的是setStyle({<style_options>});除了 className之外，其他任何L.path选项都适用于任何一种情况，例如color，fillOpacity，weight等

E.g。

L.geoJson(geojson, { onEachFeature: function (feature, layer) { // this works layer.setStyle({color: '#faa', fillOpacity: 0.4, weight: 1}); // this works too layer.setStyle({className: 'grid-cell'}); layer.on('click', function(e){ // and this works layer.setStyle({color: '#afa', fillOpacity: 0.4, weight: 2}); // BUT THIS DOES NOT WORK this.setStyle({className: 'grid-cell'}); this.bringToFront(); }); } }).addTo(map);

知道这里有什么？ Here's a plunker说明了这个问题。

Answer 1

有关此问题的讨论，请查看此处：https://github.com/Leaflet/Leaflet/issues/2662。其中一条评论：

我不认为setStyle应该实际更改className。该类实际上不是样式属性，处理leaflet-类所需的逻辑看起来像是一个黑客。我认为setClassName()或add / removeClass API会更合适。

在Leaflet的事件回调中设置图层className

1 个答案: