使用没有插件的传单更改不透明度

Question

我有一个 geojson 并尝试更改按钮的不透明度，但它仍然不起作用。

其中 statesData 是我的 geojson.js，style 和 onEachFeacture 是我拥有的其他功能。

这是我的按钮：

<span id="image-opacity">0.5</span>
<input type="range" id="sldOpacity" min="0" max="1" step="0.1" value="0.5" />

这是我的 JS

$('#sldOpacity').on('change', function(){
  $('#image-opacity').html(this.value);
  geojson.setOpacity(this.value);
});

var geojson = L.geoJson(statesData, {
        style: style,
        onEachFeature: onEachFeature
    }).addTo(map);

我试过将 opacity: opacity 放在 style: style 之上并创建一个函数 opacity() 但也不起作用。我做了什么？

Answer 1

L.GeoJSON 没有 setOpacity 方法。使用 setStyle 方法。也没有必要使用 jQuery:

L.DomEvent.on(L.DomUtil.get('sldOpacity'), 'change', function () {
    L.DomUtil.get('image-opacity').textContent = this.value;
    geojson.setStyle({
        opacity: this.value
    });
});

参考：http://leafletjs.com/reference-1.2.0.html#geojson

使用没有插件的传单更改不透明度

Change opacity using leaflet without plugin

javascript

geojson

leaflet