Skip to content
Álvaro Ramírez edited this page Mar 14, 2024 · 27 revisions

WMTS (Web Map Tile Service) es un estándar OGC para servir información geográfica en forma de tiles pregenerados a unas resoluciones específicas. El API permite visualizar este tipo de capas.

1.- Añadiéndolas en el constructor del mapa. Ejemplo en modo cadena:

const mapajs = M.map({
    container: "map",
    layers: ["WMTS*http://www.ign.es/wmts/pnoa-ma?*OI.OrthoimageCoverage*EPSG:25830*PNOA"],
    center: [363063, 4150610],
    zoom: '4',
    controls: ['backgroundlayers'],
    projection: 'EPSG:3857*m',
  });

2.- Con el método correspondiente (addWMTS/addLayers). Ejemplo en modo objeto:

const layer = new M.layer.WMTS({
    url: "http://www.ign.es/wmts/pnoa-ma",
    name: "OI.OrthoimageCoverage",
    matrixSet: "EPSG:25830",
    legend: "PNOA"
  },
  {
    format: 'image/png'
  });

  mapajs.addWMTS(layer);
const ocupacionSuelo = new M.layer.WMTS({
    url: 'https://wmts-mapa-lidar.idee.es/lidar',
    name: 'EL.GridCoverageDSM',
    legend: 'Modelo Digital de Superficies LiDAR',
    matrixSet: 'GoogleMapsCompatible',
    visibility: true,
}, {});
  mapajs.addLayers(ocupacionSuelo);

Donde:

  • url: Url del servicio WMTS.

  • name: Identifier de la Layer en el Capabilities del servicio.

  • matrixSet: La matriz seleccionada de las definidas en el Capabilities del servicio.

  • legend: Nombre que mostrará la capa en el árbol de contenido, si existe.

  • format: Opcionalmente, el formato en el que solicitar la imagen.

  • transparent: 'false' si es una capa base, 'true' en caso contrario.

  • isBase: 'true' si es una capa base, 'false' en caso contrario.

  • useCapabilities: Define si se utilizará el capabilities para generar la capa.

  • maxExtent: Restringe la visibilidad de la capa a una extensión.

  • 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.

    • maxZoom: Zoom máximo aplicable a la capa.
    • minZoom: Zoom mínimo aplicable a la capa.
    • minScale: Escala mínima.
    • maxScale: Escala máxima.
    • minResolution: Resolucción mínima.
    • maxResolution: Resolucción máxima.
    • format: Formato.
    • crossOrigin: Atributo crossOrigin para las imágenes cargadas.
    • visibility: Define si la capa es visible o no. Verdadero por defecto.
    • displayInLayerSwitcher: Indica si la capa se muestra en el selector de capas.
    • opacity: Opacidad de capa, por defecto 1.
  • vendorOptions. Opciones para la biblioteca base (el código se envía directamente a la librería base para ejecutar la funcionalidad). Ejemplo vendorOptions:

{
 opacity: 0.1
}

Ejemplo completo de creación de capa WMTS:

const layer = new M.layer.WMTS({
  url: "http://www.ign.es/wmts/pnoa-ma",
  name: "OI.OrthoimageCoverage",
  matrixSet: "EPSG:25830",
  legend: "PNOA"
}, {
  format: 'image/png' // formato de la imagen
}, {
  opacity: 0.5 // aplica opacidad a la capa
});

Ejemplo funcional

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

2. MAPA
2.1. Capas

 ■ 2.1.1. Fuentes
   • 2.1.1.1. Capas vectoriales
     + Vector
     + WFS
     + GeoJSON
     + KML
     + MVT
     + OGCAPIFeatures
     + MBTilesVector
     + GenericVector
   • 2.1.1.2. Capas ráster
     + WMS
     + WMTS
     + TMS
     + XYZ
     + OSM
     + MBTiles
     + GenericRaster
   • 2.1.1.3. Capas rápidas

 ■ 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

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 de desarrollo de plugins
  > Guía de desarrollo de visualizadores con React
  > Guía de desarrollo de componentes
  > Guía para el desarrollo de API-CNIG
  > Compilación proyecto API-CNIG

Clone this wiki locally