GeoJSON - Desarrollos-IDEE/API-IDEE GitHub Wiki

GeoJSON, pese a no ser un estándar OGC (está camino de convertirse en ello), es un formato de intercambio de información geográfica muy extendido que, al igual que WFS, permite tener todos los elementos en el cliente. Es un formato estádar abierto diseñado para represetar objetos geográficos sencillos, junto con sus atributos no espaciales. Es ampliamente ultilizado en aplicaciones de cartografía en entornos web al permitir el intercambio de datos de manera rápida, ligera y sencilla. La grámatica del formato esta basada en WKT Well Known Text.

Parámetros disponibles:

  • name: nombre de la capa.
  • 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.
  • source: fuente de la capa. Si se indica source no se debe de indicar URL.
  • maxExtent: Restringe la visibilidad de la capa a una extensión.
    • No disponible para la implementación de CesiumJS.
  • url: url del fichero o servicio que genera el GeoJSON. Si se indica URL no se debe de indicar source.
  • 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 GeoJSON 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 GeoJSON 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.

    • hide: Atributos ocultos.
    • show: Mostrar atributos.
    • 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.
    • 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.
    • style: Define el estilo de la capa.
    • minScale: Escala mínima.
    • maxScale: Escala máxima.
    • predefinedStyles: Estilos predefinidos para la capa, aparecen en el selector de capas "LayerSwitcher" para cambiar el estilo de la capa.
    • 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.

  • vendorOptions: 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.GeoJSON({}, {
}, {
  source: new ol.source.Vector({
    format: new ol.format.GeoJSON(),
    url: 'https://geostematicos-sigc.juntadeandalucia.es/geoserver/tematicos/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=tematicos:Provincias&maxFeatures=50&outputFormat=application%2Fjson',
    strategy: ol.loadingstrategy.bbox,
  }),
});

Ejemplo completo de creación de capa GeoJSON:

const layer = new IDEE.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"
}, {
  maxZoom: 10, // Zoom mínimo aplicable a la capa
  // aplica un estilo a la capa
  style: new IDEE.style.Polygon({
    fill: {
      color: 'red'
    }
  })
}, {
  opacity: 0.5 // aplica opacidad a la capa
});

Dependiendo la fuente del GeoJSON, para añadirlo al API-IDEE:

💡 En el caso de las capas de tipo GeoJSON, se diferencia si el mismo es servido (url) o si por el contrario lo tenemos en local (source).

1.- GeoJSON local:

// creamos la capa
const capa = new IDEE.layer.GeoJSON({
    name: "capaJson",
    source: {
    "type": "FeatureCollection",
    "features": [{
        "properties": {
            "estado": 1,
            "vendor": {
                "api_idee": {}
            },
            "sede": "/Sevilla/CHGCOR003-Oficina de la zona regable del Genil",
            "tipo": "ADSL",
            "name": "/Sevilla/CHGCOR003-Oficina de la zona regable del Genil"
        },
        "type": "Feature",
        "geometry": {
            "type": "Point",
            "coordinates": [-5.278075, 37.69374444444444]
        }
    }],
    "crs": {
        "properties": {
            "name": "EPSG:4326"
        },
        "type": "name"
    }
})

// y la añadimos al mapa
mapajs.addLayers(capa);

// También es posible crear una capa vacía
const layer = new IDEE.layer.GeoJSON({
  name: "Catastro",
  crs: "25830"
});
// Y añadirle posteriormente los objetos geográficos previamente creados
layer.addFeatures([feature1, feature2, feature3]);

⚠️ Hay que tener en cuenta que, en el caso de no establecer el crs, se tomará el establecido por defecto en el estándar: EPSG:4326

2.- GeoJSON servido:

const layer = new IDEE.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);

Ejemplos funcionales

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