OGCAPIFeatures - Desarrollos-IDEE/API-IDEE GitHub Wiki

OGCAPIFeatures (OGC API - FEATURES) es un estándar OGC que ofrece la capacidad de crear, modificar y consultar datos espaciales en la Web y especifica requisitos y recomendaciones para las API que desean seguir una forma estándar de compartir datos de entidades.

Para visualizar capas OGCAPIFeatures, se pueden:

1.- Añadir en el constructor del mapa, tanto en modo cadena como objeto:

// Ejemplo de capas OGCAPIFeatures en modo cadena 
const mapajs = IDEE.map({
  container: "map",
  center: { x: -965497.2717184591, y: 4166095.580546307 },
  zoom: 5,
  controls: ['backgroundlayers'],
  layers: ["OGCAPIFeatures*Capa*https://api-features.idee.es/collections/*falls*30"]
});

2.- O añadiéndolas con el método correspondiente (addOGCAPIFeatures o addLayers):

// Ejemplo de capas WFS en modo objeto
const layer = new IDEE.layer.OGCAPIFeatures({
  url: 'https://api-features.idee.es/collections/',
  name: 'falls',
  legend: 'Capa OGCAPIFeatures',
  limit: 20  
});

mapajs.addOGCAPIFeatures(layer);

Donde:

  • url: url del servicio.
  • name: nombre de la capa en el servidor.
  • legend: indica el nombre que queremos que aparezca en el árbol de contenidos, si lo hay.
  • isBase: 'true' si se quiere definir la capa como capa base, 'false' en caso contrario.
  • limit: límite de features a mostrar en la capa.
  • bbox: filtro para mostrar los resultados de un bbox específico.
  • format: formato de respuesta de los objetos geográficos.
  • offset: determina desde que número comenzará a leer los features.
  • id: filtro por ID para un feature.
  • maxExtent: Restringe la visibilidad de la capa a una extensión.
  • conditional: filtro de condiciones literales.
  • infoEventType: Opcional Parametriza el método de activación del popup para obtener la información de una feature ('click' / 'hover'), por defecto 'click'.
  • extract: Opcional Activa la consulta por clic en el objeto geográfico, por defecto verdadero.
    • Las capas OGCAPIFeatures cuentan con métodos get y set para modificar el extract.
capa.extract = true; // activa consulta
capa.extract = false; // desactiva consulta
console.log(capa.extract); // muestra el estado de la propiedad
  • template: Opcional Plantilla que se mostrará al consultar un objeto geográfico.
    • Las capas OGCAPIFeatures cuentan con métodos get y set para modificar el template.
capa.template = `<div>My custom popup</div>`; // especifica la plantilla
console.log(capa.template); // muestra el estado de la propiedad

  • attribution: Atribución de la capa.

    • name. Nombre de la atribución
    • description. Descripción de la atribución.
    • url. URL de la atribución.
    • contentAttributions. Atribuciones por objetos geográficos, por defecto vacío.
    • contentType. Tipo de url de “contentAttributions” (KML o GeoJSON).

  • options: Estas opciones se mandarán a la implementación de la capa.

    • predefinedStyles: estilos predefinidos para la capa, aparecen en el selector de capas "LayerSwitcher" para cambiar el estilo de la capa.
    • style: estilo actual de la capa.
    • minZoom: Zoom mínimo aplicable a la capa.
    • maxZoom: Zoom máximo aplicable a la capa.
    • displayInLayerSwitcher: Indica si la capa se muestra en el selector de capas.
    • visibility: Define si la capa es visible o no. Verdadero por defecto.
    • opacity: Opacidad de capa, por defecto 1.
    • minScale: Escala mínima.
    • maxScale: Escala máxima.
    • cql: filtro CQL (disponible para servicios PostgreSQL).

  • vendorOpts: Opciones para la biblioteca base (el código se envía directamente a la librería base para ejecutar la funcionalidad). Ejemplo vendorOptions:

new IDEE.layer.OGCAPIFeatures({}, {}, {
  source: new ol.source.Vector({
    format: new ol.format.GeoJSON(),
    url: 'https://api-features.idee.es/collections/portarea/items?f=json',
  }),
});

Ejemplo completo de creación de capa OGCAPIFeatures:

const layer = new IDEE.layer.OGCAPIFeatures({
  url: 'https://api-features.idee.es/collections/',
  name: 'falls',
  legend: 'Capa OGCAPIFeatures',
  limit: 20
}, {
  displayInLayerSwitcher: false, // no muestra capa en TOC
  // aplica un estilo a la capa
  style: new IDEE.style.Point({
    fill: {
      color: 'red',
    }
  })
}, {
  opacity: 0.5 // aplica opacidad a la capa
});

Ejemplos:

⚠️ **GitHub.com Fallback** ⚠️