Skip to content

2.1.1.1. Capas vectoriales

yaizavalidador edited this page Jul 2, 2024 · 9 revisions

¿Qué es una capa vectorial?

En un modelo de datos vectorial se recogen las características de los fenómenos de la realidad mediante entidades geométricas que definen sus límites. Según el fenómeno que se trate se utilizarán puntos, líneas o polígonos para representarlos, codificandolos explícitamente mediante las coordenadas de los puntos o vértices que forman los segmentos de líneas y polígonos.

A diferencia de las capas ráster, donde el cliente recibe una imagen o parte ella generada por el servidor de mapas, las capas vectoriales se descargan en el cliente, y éste es el que las representa. La API soporta los siguientes tipos de capas vectoriales:

¿Qué es un feature?

Un feature representa un fenómeno o elemento geográfico de una capa vectorial. Está formado por un identificador, una geometría y una serie de atributos alfanuméricos o propiedades. Por ejemplo, un feature que representa un edificio puede tener atributos como su altura, su área, su uso, su fecha de construcción, etc. Los features son representados en un SIG por medio de geometrías que describen su forma y posición en el mapa. Las geometrías pueden ser de diferentes tipos como puntos, líneas o polígonos.

Cuando un servidor de mapas nos devuelve una capa vectorial, nos está mandando el conjunto de todos los features o elementos que la forman:

const mapajs = M.map({
  container: "map",
  wmcfiles: ["cdau"]
});

//capa vectorial GeoJSON de provincias servida  
const layer = new M.layer.GeoJSON({
  name: "Provincias",
  url: "http://geostematicos-sigc.juntadeandalucia.es/geoserver/tematicos/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=tematicos:Provincias&maxFeatures=50&outputFormat=application/json"
});

mapajs.addLayers(layer);

// Cada feature es una provincia en esta capa
layer.on(M.evt.LOAD, function() {
  layer.getFeatures().forEach(function(feature) {
    console.log('Provincia: ' + feature.getAttribute('nombre'));
  })
});

Dispone de métodos para obtener/establecer su id, sus atributos y su geometría. Estos son algunos métodos comunes a todas las capas vectoriales:

// Creamos feature
const feature= new M.Feature("featurePrueba002", {
                  "type": "Feature",
                  "id": "prueba_pol_wfst.1985",
                  "geometry": {
                    "type": "Polygon",
                    "coordinates": [
                        [
                          [263770.72265536943,4085361.4590256726],
                          [230910.00600234355,4031901.3328427672],
                          [288293.77947248437,4017678.0840030923],
                          [263770.72265536943,4085361.4590256726]
                        ]
                      ]
                  },
                  "geometry_name": "geometry",
                  "properties": {
                    "cod_ine_municipio": "41091", 
                    "cod_ine_provincia": "-", 
                    "area": 1234,
                    "perimetro": 345, 
                    "cod_ine_comunidad": "-",
                    "nombre": "feature2",
                    "nom_provincia": "Cádiz",
                    "alias": "f2",
                    "nom_ccaa": "Andalucía"
                  }
              });
// lo añadimos a la capa
capaVectorial.addFeatures([feature])


// Añadir feature
capaVectorial.addFeatures([feature]);
// Eliminar feature
capaVectorial.removeFeatures([feature]);
// Obtener los features de una capa
const elementos = capaVectorial.getFeatures();
// Obtener la extension de los features de una capa
const bbox = capaVectorial.getFeaturesExtent();
// O eliminarlos todos los features
capaVectorial.clear();

💡 Dos features serán iguales si tienen el mismo id.

También es posible definir un feature desde cero mediante la especificación GeoJSON correspondiente:

const capaGeoJSON = new M.layer.GeoJSON({
          source: {
            "crs": {"properties": {"name": "EPSG:25830"},"type": "name"},
            // Se añade su notacion GeoJSON
            "features": [feature.getGeoJSON()],
            "type": "FeatureCollection"
          },
          name: 'prueba'
        });

       mapajs.addLayers(capaGeoJSON);

       // Otra opción: añadir el feature a la capa
       //capaGeoJSON.addFeatures(feature);

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

  > Compilación proyecto API-CNIG

Clone this wiki locally