Cultivo Declarado

<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Documento HTML</title>
<script src="https://cdn.jsdelivr.net/npm/ol@v9.1.0/dist/ol.js"></script>
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script>
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css"/>

<style>

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

.map {
    width: 100%;
    height: 100%;
  }

</style>

</head>
<body>
<div id="map" class="map"></div>
<script>

// === Parámetros del servicio OGC API Features ===
const baseUrl= "https://sigpac-hubcloud.es/ogcapi/collections/cultivo_declarado/items";
const limit = 100;

const map = L.map('map').setView([42.306, -3.89], 15);

L.tileLayer('https://tms-ign-base.idee.es/1.0.0/IGNBaseTodo/{z}/{x}/{-y}.jpeg', {
  attribution: 'IGN'
}).addTo(map);

const geoJsonLayer = L.geoJSON(null, {
  style: {
    color: 'rgba(0, 40, 40, 0.3)',
    weight: 2,
    fillColor: 'rgba(0, 255, 0, 0.8)',
    fillOpacity: 0.3
  }
}).addTo(map);

let currentAbortController = null;
let debounceTimer = null;

async function loadFeaturesForView() {
  if (currentAbortController) currentAbortController.abort();
  currentAbortController = new AbortController();

const url = buildUrlFromBounds(map.getBounds());

try {
    const resp = await fetch(url, { signal: currentAbortController.signal });
    const data = await resp.json();

if (!data.features) {
      console.warn("Respuesta sin 'features'");
      geoJsonLayer.clearLayers();
      return;
    }

// Reemplazamos contenido
    geoJsonLayer.clearLayers();
    geoJsonLayer.addData(data);
  } catch (err) {
    if (err.name !== 'AbortError') {
      console.error("Error al cargar los datos:", err);
    }
  }
}

function onMoveEndDebounced() {
  clearTimeout(debounceTimer);
  debounceTimer = setTimeout(loadFeaturesForView, 200);
}

map.on('moveend', onMoveEndDebounced);

loadFeaturesForView();

</script>
</body>
</html>