[Mapea42 DES] TEST - filtro 2layers

by SIGC GUADALTEL

HTML

<script src="http://sigc.desarrollo.guadaltel.es/mapea42_factoria/js/mapea.ol.min.js"></script>
<script src="http://sigc.desarrollo.guadaltel.es/mapea42_factoria/js/configuration.js"></script>
<link rel="stylesheet" href="http://sigc.desarrollo.guadaltel.es/mapea42_factoria/assets/css/mapea.ol.min.css">
<button id="btnFiltrar" onclick="setFiltro()">
  Filtrar
</button>
<button id="filtrar" onclick="limpiar();">
  Limpiar filtro
</button>
<div id="map"></div>

CSS

html,
body {
  margin: 0;
  padding: 0;
  height: 100%;
  overflow: hidden;
}

JavaScript

let mapajs = M.map({
  container: "map",
  wmcfile: "callejero",
  controls: ["layerswitcher"]
});


let lySevilla = new M.layer.WFS({
  name: "Provincias",
  url: "http://geostematicos-sigc.juntadeandalucia.es/geoserver/tematicos/wfs",
  namespace: "tematicos",
  cql: "nombre='Sevilla'"
});
lySevilla.on(M.evt.LOAD, function() {
  lySevilla.setStyle(new M.style.Polygon({
    stroke: {
      color: 'yellow',
      width: 3
    }
  }));
});

let lyComarcas = new M.layer.WFS({
  name: "comarcas",
  url: "http://geostematicos-sigc.juntadeandalucia.es/geoserver/tematicos/wfs",
  namespace: "tematicos"
});

let f = new M.Feature("f", {
  "type": "Feature",
  "id": "f",
  "geometry": {
    "type": "Polygon",
    "coordinates": [
      [
        [187811.8571096273, 4081466.260144673],
        [187811.8571096273, 4231380.3702658685],
        [353698.63041960564, 4231380.3702658685],
        [353698.63041960564, 4081466.260144673]
      ]
    ]
  },
  "properties": {"nombre":"envelope"}
});
let lyEnvelope = new M.layer.GeoJSON({
  source: {
    "crs": {
      "properties": {
        "name": "EPSG:25830"
      },
      "type": "name"
    },
    "features": [],
    "type": "FeatureCollection"
  },
  name: 'prueba'
});
//NO TIENE SENTIDO ESPERAR AL LOAD DE UNA CAPA QUE NO HACE NINGUNA PETICIÓN
lyEnvelope.on(M.evt.LOAD, function() {
  lyEnvelope.addFeatures(f);
});


mapajs.addLayers([lyComarcas, lySevilla, lyEnvelope]);


function setFiltro() {
  
  let filter = M.filter.spatial.WITHIN(lySevilla);
  lyComarcas.setFilter(filter);
	  
  //NO FUNCIONA?¿?¿ se aplicaría al revés?
  //let filter = M.filter.spatial.CONTAIN(lyEnvelope);
  //lyComarcas.setFilter(filter);
  //let filter = M.filter.spatial.CONTAIN(lySevilla);
  //lyComarcas.setFilter(filter);
}

function limpiar() {
  lyComarcas.removeFilter();
}