Search code examples
javascriptopenlayersopenlayers-5

OpenLayers TileLayer, How to switch between force-on/off and zoom-based visibility?


i have a button to select either:

  • Force Visible
  • Force Invisible
  • Visible between preconfigured Zoom-levels.

The doc https://openlayers.org/en/latest/apidoc/module-ol_layer_Base-BaseLayer.html doesn't specify how the visible and min/maxResolution work together. i need the min/maxResolution to be able to be overruled by forcing visible/invisible.

What i have is this.

  if (value == 0) { // by zoomlevel
    var mapLayer = wmsLayerDefs[index].mapLayerCfg;
    wmsLayer.setMinResolution(view.getResolutionForZoom(mapLayer.zoomLimits.max));
    wmsLayer.setMaxResolution(view.getResolutionForZoom(mapLayer.zoomLimits.min));
  } else if (value == 1) { //off
    wmsLayer.setMinResolution(view.getResolutionForZoom(0));
    wmsLayer.setMaxResolution(view.getResolutionForZoom(0));
  } else if (value == 2) { //on
    wmsLayer.setMinResolution(undefined);
    wmsLayer.setMaxResolution(undefined);
    wmsLayer.setVisible(true);
  }

Option 2 isn't showing anything. i also tried as below, but it's not becoming visible. i guess the value for 50 isn't accepted. i don't know against what to clamp it.

  } else if (value == 2) { //on
    wmsLayer.setMinResolution(view.getResolutionForZoom(0));
    wmsLayer.setMaxResolution(view.getResolutionForZoom(50));
  }

Options 1 and 2 is where i'm struggling to get it proper

Using ecmascript 5 and ol-5.3.0.js (i'm not that well versed in javascript)


Solution

  •   } else if (value == 1) { //off
        wmsLayer.setMinResolution(Infinity);
        wmsLayer.setMaxResolution(0);
      } else if (value == 2) { //on
        wmsLayer.setMinResolution(0);
        wmsLayer.setMaxResolution(Infinity);
      }
    

    should be sufficient. For "off" having both settings zero, or both Infinity would also work.