-
Notifications
You must be signed in to change notification settings - Fork 15
XYZ
Las capas XYZ son servicios de información geográfica en forma de tesela. Cada tesela representa una combinación de tres parámetros. Las capas XYZ presentan la siguiente estructura:
https://tile.opentopomap.org/{z}/{x}/{y}.png
En donde:
- {z} especifica el nivel de zoom.
- {x} el número de columna.
- {y} el número de fila.
En https://leaflet-extras.github.io/leaflet-providers/preview/ se pueden obtener distintos servicio XYZ.
Se pueden construir de varias maneras:
1.- Añadiéndolas en el constructor del mapa. Modo cadena:
const mapa = M.map({
container: 'map',
getfeatureinfo: 'plain',
projection: 'EPSG:3857*m',
layers: ["XYZ*AtlasDeCresques*https://www.ign.es/web/catalogo-cartoteca/resources/webmaps/data/cresques/{z}/{x}/{y}.jpg*true*true"],
zoom: 7,
center: [-491123.5838198825, 4868765.072772329],
});
2.- Con el método correspondiente (addXYZ/addLayers). Modo objeto:
const xyz = new M.layer.XYZ({
url: 'https://www.ign.es/web/catalogo-cartoteca/resources/webmaps/data/cresques/{z}/{x}/{y}.jpg',
name: 'AtlasDeCresques',
visibility: true,
});
mapa.addXYZ(xyz);
Donde:
-
url: URL del servicio XYZ.
-
name: Identificador de la capa.
-
legend: Indica el nombre que queremos que aparezca en el árbol de contenidos, si lo hay.
-
transparent: 'false' si es una capa base, 'true' en caso contrario.
-
isBase: 'true' si es una capa base, 'false' en caso contrario.
-
maxExtent: Restringe la visibilidad de la capa a una extensión.
-
visibility: Indica si la capa estará por defecto visible o no.
-
displayInLayerSwitcher: Indica si la capa se muestra en el selector de capas.
-
tileGridMaxZoom: Zoom máximo de cuadrícula de mosaico. (Sobrescribe minZoom y maxZoom)
-
tileSize: Tamaño de la tesela.
-
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: Parámetros opcionales para la capa.
- opacity: Opacidad de capa, por defecto 1.
- minZoom: Zoom mínimo aplicable a la capa.
- maxZoom: Zoom máximo aplicable a la capa.
- crossOrigin: Atributo crossOrigin para las imágenes cargadas.
-
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,
}
const layer = new M.layer.XYZ({
url: 'https://www.ign.es/web/catalogo-cartoteca/resources/webmaps/data/cresques/{z}/{x}/{y}.jpg',
name: 'AtlasDeCresques',
visibility: true,
}, {
displayInLayerSwitcher: false, // No muestra la capa en el TOC
minZoom: 5 // zoom mínimo aplicable a la capa.
}, {
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.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
+ WMTS
+ TMS
+ XYZ
+ OSM
+ MBTiles
+ GenericRaster
+ GeoTIFF
• 2.1.1.3. Capas rápidas
• 2.1.1.4. Grupo de capas
■ 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.4. Paneles
» Creación de panel desde cero sin controles
» Tutorial Panel de un único control
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
9. GUÍA DE DESARROLLO
> Guía para el desarrollo de API-CNIG
» Tutorial desarrollo del núcleo de API-CNIG - (Cliente)
> Guía de desarrollo de componentes
» Tutorial desarrollo del núcleo de API-CNIG - (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