[Test] Filtro extent

by Francisco

HTML

<script src="https://mapea4-sigc.juntadeandalucia.es/js/mapea-5.1.0.ol.min.js"></script>
<link rel="stylesheet" href="https://mapea4-sigc.juntadeandalucia.es/assets/css/mapea-5.1.0.ol.min.css">
<script src="https://mapea4-sigc.juntadeandalucia.es/js/configuration-5.1.0.js"></script>
<button id="filtrar" onclick="filtrar();">
  Filtrar por bbox actual
</button>

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

CSS

html,
body,
#map {
  padding: 0;
  margin: 0;
  width: 100%;
  height: 100%;
}

JavaScript

var mapajs = M.map({
  container: "map",
  wmcfiles: ["mapa"],
  controls: ["mouse"]
});

let layer = new M.layer.GeoJSON({
  name: 'prueba',
  source: {
    "crs": {
      "properties": {
        "name": "EPSG:25830"
      },
      "type": "name"
    },
    type: "FeatureCollection",
    features: [{
      id: "feature1",
      properties: {
        name: "feature1"
      },
      type: "Feature",
      geometry: {
        type: "Point",
        coordinates: [293297, 4190525]
      }
    }, {
      id: "feature2",
      properties: {
        name: "feature2"
      },
      type: "Feature",
      geometry: {
        type: "Point",
        coordinates: [299183, 4173358]
      }
    }, {
      id: "feature3",
      properties: {
        name: "feature3"
      },
      type: "Feature",
      geometry: {
        type: "Point",
        coordinates: [357548, 4201805]
      }
    }, {
      id: "feature4",
      properties: {
        name: "feature4"
      },
      type: "Feature",
      geometry: {
        type: "Point",
        coordinates: [436513, 4138535]
      }
    }],
  }
});

mapajs.addLayers([layer]);

// Pasa un extent a GeoJSON
function extentToGeoJSON(extent) {

  return {
    'type': 'Polygon',
    'coordinates': [
      [
        [extent.x.min, extent.y.min],
        [extent.x.min, extent.y.max],
        [extent.x.max, extent.y.max],
        [extent.x.max, extent.y.min],
        [extent.x.min, extent.y.min]
      ]
    ]
  }

}


// Saca por consola los features que se encuentran en la vista
function filtrar() {
  let extent = mapajs.getBbox();
  let filterContain = M.filter.spatial.CONTAIN(extentToGeoJSON(extent));
  let featuresFiltrados = filterContain.execute(layer.getFeatures());


  console.log('---------------------------');
  featuresFiltrados.forEach(f => {
    console.log(f.getId() + ' se encuentra en la vista actual');
  })

}