Mapea5 - Filtros
by SIGC
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>
<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"]
});
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.LIKE("nombre", nProv);
if (!M.utils.isNullOrEmpty(filtroCapa)) {
if (document.querySelector('#chkY').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 (document.querySelector('#chkY').checked) {
filter = M.filter.AND([filtroCapa, filter]);
} else { // OR
filter = M.filter.OR([filtroCapa, filter]);
}
}
lyProvincias.setFilter(filter);
}
function limpiar() {
lyProvincias.removeFilter();
}