I am trying to change the opacity of vector layers using one slider but I seem not to get the right logic to loop each item as opposed to just the first. Here is my code so far. Link to full code

This is where I guess I have the particular issue.

map.getLayers().forEach(function(layer, i) {
      bindInputs('#layer' + i, layer);
      if (layer instanceof ol.layer.Group) {
        layer.getLayers().forEach(function(sublayer, j) {
          bindInputs('#layer' + (i) + (j), sublayer);
  • I don't think it's an OpenLayers problem. Adding console.log('#layer' + (i) + (j)); to your code shows it is getting all the layers. For some reason I don't understand the binding is only working on one vector layer. The code should also work on the OSM layer, but it doesn't. – Mike Jan 19 '19 at 15:34
  • Yes, @Mike. It doesn't look like an ol issue but had to include it in the title just to get to the appropriate audience (despite the tag). That said, in the link I provided, just the first layer works on moving the range bar. – b_jugger Jan 19 '19 at 15:39
  • Just discovered my error. It works this way now. <div id="layer1"> <input class="transp" type="range" min="0" max="1" step="0.01"/> </div> and changed this too bindInputs('#layer' + (j), sublayer); link updated with solution – b_jugger Jan 19 '19 at 15:44

Your Answer

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

Browse other questions tagged or ask your own question.