Skip to content

OGCAPIFeatures

gdtel-cnig-develop edited this page Sep 2, 2025 · 11 revisions

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 la fuente de datos 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.
    • No disponible para la implementación de CesiumJS.
  • 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.
    • No disponible para la implementación de CesiumJS.
  • 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.
      • No disponible para la implementación de CesiumJS.
    • maxZoom: Zoom máximo aplicable a la capa.
      • No disponible para la implementación de CesiumJS.
    • 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).
    • height: Define la altura del objeto geográfico. Puede ser un número o una propiedad.
    • Si se define la altura será constante para todos los puntos de los objetos geográficos de la fuente de datos.
    • Sólo disponible para geometrías poligonales.
    • Sólo disponible para la implementación de CesiumJS.
    • clampToGround: Define si el objeto geográfico se debe ajustar al suelo, por defecto falso.
    • Si se indica este parámetro el parámetro height se obviará.
    • Sólo disponible para la implementación de CesiumJS.
  • 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.Generic({point: {
    fill: {
      color: 'red',
    }
  }})
}, {
  opacity: 0.5 // aplica opacidad a la capa
});

Ejemplos:

1.INICIO
   1.1. Componentes de la API-IDEE
   1.2. Documentación y Puntos de acceso
   1.3. Primeros pasos
   1.4. Diagrama API IDEE

2. MAPA
2.1. Capas

 ■ 2.1.1. Fuentes
   • 2.1.1.1. Capas vectoriales
     + Vector
     + WFS
     + GeoJSON
     + KML
     + MVT
     + OGCAPIFeatures
     + MBTilesVector
     + GenericVector
     + MapLibre
   • 2.1.1.2. Capas ráster
     + WMS
     + WMC
     + WMTS
     + TMS
     + XYZ
     + OSM
     + MBTiles
     + GenericRaster
     + GeoTIFF
     + GeoPackageTile
   • 2.1.1.3. Capas 3D
     + Terreno
     + 3DTiles
       + info 3DTiles
   • 2.1.1.4. Capas rápidas
   • 2.1.1.5. Grupo de capas
   • 2.1.1.6. Secciones
   • 2.1.1.7. GeoPackage

 ■ 2.1.2. Simbolización
   • 2.1.2.1. Genérica
     + Puntos
     + Líneas
     + Polígonos
   • 2.1.2.2. Básica
     + Puntos
     + Líneas
     + Polígonos
   • 2.1.2.3. Avanzada
     + Coropletas
     + Proporcional
     + Categorías
     + Estadísticos
     + Mapas de Calor
     + Cluster
     + Línea de flujo
     + Composición

 ■ 2.1.3. Filtros

2.3.-Plugins

  > Creación de plugin en cliente

  » Tutorial de creación de un plugin

2.4. Paneles

  » Creación de panel desde cero sin controles

  » Tutorial Panel de un único control

  » Tutorial Panel de un único control con más de un botón

  » Tutorial Panel con más de un control

2.5. Eventos

  » Gestión de eventos
  » Gestión de eventos en controles personalizados

    2.6. Internacionalización

    2.7. Configuración

    2.8. Acceso librerías base

3. UTILIDADES

4. PROXY

5. API REST
 5.1. Parametrización API-REST
 5.2. Base de Datos API-REST
 5.3. API REST Actions
 5.4. Servicio de correos electrónicos
 5.5. Capas rápidas

6. PARAMETRIZACIÓN VISUALIZADORES

7. SOLUCIÓN DE PROBLEMAS

8. PROCESO DE VERSIONADO

9. GUÍA DE DESARROLLO
  > Guía para colaborar en el repositorio
  > Guía para el desarrollo de API-IDEE
  > Guía de test de API-IDEE
  » Tutorial desarrollo del núcleo de API-IDEE - (Cliente)
  > Guía de desarrollo de componentes
  » Tutorial desarrollo del núcleo de API-IDEE - (Servidor)
  > Guía de desarrollo de plugins
  » Tutorial desarrollo de plugins ya creados
  » Tutorial desarrollo de nuevos plugins
  > Guía de desarrollo de visualizadores con React

  > Compilación proyecto API-IDEE

Clone this wiki locally