使用不带插件的传单更改不透明度 [英] Change opacity using leaflet without plugin

问题描述

我有一个geojson并尝试更改不透明度，以改变按钮，但还是无法正常工作.

I have a geojson and try change the opacity chaging the button, but it dont work anyway.

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

Where statesData is my geojson.js, style and onEachFeacture are others functions that I have.

这是我的按钮:

<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()，但也无法正常工作.我有什么?

I tried put opacity: opacity above style: style and create a function opacity() but dont work too. What I have do?

推荐答案

L.GeoJSON没有setOpacity方法.使用setStyle方法.同样也不需要使用jQuery:

L.GeoJSON does not have a setOpacity method. Use the setStyle method. Also there is no need to use 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

这篇关于使用不带插件的传单更改不透明度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！