Mapea5 - Filtros

HTML

<script src="https://sigc.desarrollo.guadaltel.es/mapea5/js/mapea.ol.min.js"></script>
<link rel="stylesheet" href="https://sigc.desarrollo.guadaltel.es/mapea5/assets/css/mapea.ol.min.css">
<script src="https://sigc.desarrollo.guadaltel.es/mapea5/js/configuration.js"></script>
<button id="filtrar" onclick="filtrar();">
  Filtrar por nombre
</button>
<input id="chkY" type="radio" checked="checked" name="condition"> Y
<input id="chkO" type="radio" name="condition"> O
<button id="filtrarSpatial" onclick="filtrarSpatial();">
  Filtrado espacial
</button>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<button id="filtrar" onclick="limpiar();">
  Limpiar filtro
</button>

<div id="map"></div>

CSS

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

JavaScript

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

 var lyProvincias = new M.layer.WFS({
   url: "http://geostematicos-sigc.juntadeandalucia.es/geoserver/tematicos/ows?",
   namespace: "tematicos",
   name: "Provincias",
   legend: "Provincias",
   geometry: 'MPOLYGON'
 });
 var miFeature = new M.Feature("featurePrueba002", {
   "type": "Feature",
   "id": "prueba_pol_wfst.1985",
   "geometry": {
     "type": "Polygon",
     "coordinates": [
       [
         [263770.72265536943, 4085361.4590256726],
         [230910.00600234355, 4031901.3328427672],
         [288293.77947248437, 4017678.0840030923],
         [263770.72265536943, 4085361.4590256726]
       ]
     ]
   },
   "properties": {
     "nombre": "feature2"
   }
 });
 lyProvincias.addFeatures(miFeature);

 mapajs.addLayers(lyProvincias);

 function filtrar() {
   let filtroCapa = lyProvincias.getFilter();
   let nProv = prompt("Introduzca parte del nombre de la provincia", "Sevilla");
   let filter =  M.filter.OR(
                     [M.filter.EQUAL("nombre", "Sevilla"),
                      M.filter.EQUAL("nombre", "Málaga")]);
   if (!M.utils.isNullOrEmpty(filtroCapa)) {

     if ($('#chkY')[0].checked) {
       filter = M.filter.AND([filtroCapa, filter]);
     } else { // OR
       filter = M.filter.OR([filtroCapa, filter]);
     }
     
   }
   lyProvincias.setFilter(filter);
 }

 function filtrarSpatial() {
   let filtroCapa = lyProvincias.getFilter();
   let filter = M.filter.spatial.INTERSECT(miFeature);
   if (!M.utils.isNullOrEmpty(filtroCapa)) {
     if ($('#chkY')[0].checked) {
       filter = M.filter.AND([filtroCapa, filter]);
     } else { // OR
       filter = M.filter.OR([filtroCapa, filter]);
     }
   }
   lyProvincias.setFilter(filter);
 }

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