3

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

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

Here is my button:

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

And here is my 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);

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

1

Declare the geojson variable first, then listen for slider change event. Furthermore, setOpacity is not a function for geojson layers. You should use setStyle:

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

$('#sldOpacity').on('change', function(){
    $('#image-opacity').html(this.value);
    geojson.setStyle({opacity: this.value, fillOpacity: this.value});
});
  • I tried it, but dont work too :( return this: Uncaught TypeError: geojson.setOpacity is not a function – Elton Santos Nov 13 '17 at 18:41
  • Typeof in geojson return object – Elton Santos Nov 13 '17 at 18:53
  • 1
    Ok, I've just updated the answer to solve the issue. – Antonio Falciano Nov 13 '17 at 19:00

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.