SIG

Publicación de Información Geográfica (Servidores de Mapas)

José Samos Jiménez
()
Dpto. LSI
Universidad de Granada

Citar y Licencia: https://doi.org/10.6084/m9.figshare.27643968.v1

Vídeo: https://youtu.be/ZSWu-7MyB8E

Introducción: publicación “tradicional”

Publicación actual (i)

Publicación actual (y ii)

Publicación actual: arquitectura

Contenido


  • Introducción

  • Servidor de Mapas

  • Cliente

  • Servidor Web

  • Hitos en la historia

  • Conclusiones

Servidor de Mapas

Evolución hacia los Servidores de Mapas

  • Servidor Web

    • Imágenes

    • Scripts CGI (Common Gateway Interface)

      • Perl, C, Python
    • SIG de escritorio

      • GRASS
    • Java

      • Java Applets, Servlets

Arquitectura de un Servidor de Mapas

Servidor de Mapas: Acceso a Datos

Servidores de Mapas

Característica GeoServer MapServer QGIS Server ArcGIS Server
Tipo Software libre Software libre Software libre Privativo
Lenguaje base Java C/C++ C++ C++, Python
Interfaz de administración No (manual) No (QGIS Desktop)
Soporte OGC Parcial
Caché Sí (GeoWebCache) No No Sí (Tile Cache)
Soporte de estilos SLD, CSS Mapfile QGIS Styling (SLD limitado) MXD, simbología ArcGIS
Soporte BDE Excelente Muy bueno Bueno (PostGIS) Muy bueno (propio)
Soporte formatos Excelente Muy bueno Bueno Muy bueno (propio)
Característica principal Extensibilidad y personalización Alto rendimiento y eficiencia Integración con QGIS Desktop Integración con suite ArcGIS
Desventajas Requiere más recursos; curva de aprendizaje en estilos Sin GUI, configuración manual compleja Depende de QGIS Desktop para administración Coste de licencia alto; depende de ArcGIS Online
Uso Publicación y geoprocesamiento avanzado Mapas rápidos y ligeros Publicación directa de proyectos QGIS Organizaciones con ArcGIS, servicios avanzados

Cliente

¿“HTML, JavaScript” o “HTML, JSON”?

<div class="leaflet html-widget html-fill-item" 
     id="htmlwidget-9caa0b9adf697efa211d" 
     style="width:100%;height:576px;">
</div>

<script type="application/json" data-for="htmlwidget-9caa0b9adf697efa211d">
{
  "x": {
    "options": {
      "crs": {
        "crsClass": "L.CRS.EPSG3857",
        "code": null,
        "proj4def": null,
        "projectedBounds": null,
        "options": {}
      }
    },
    "setView": [
      [37.19722, -3.62444],
      15,
      []
    ],
    "calls": [
      {
        "method": "addWMSTiles",
        "args": [
          "https://www.ign.es/wms-inspire/ign-base",
          null,
          null,
          {
            "styles": "",
            "format": "image/png",
            "transparent": false,
            "version": "1.1.1",
            "attribution": "IGN",
            "layers": "IGNBaseTodo"
          }
        ]
      },
      {
        "method": "addMarkers",
        "args": [
          37.19722,
          -3.62444,
          null,
          null,
          null,
          {
            "interactive": true,
            "draggable": false,
            "keyboard": true,
            "title": "",
            "alt": "",
            "zIndexOffset": 0,
            "opacity": 1,
            "riseOnHover": false,
            "riseOffset": 250
          },
          "ETSIIT-UGR",
          null,
          null,
          null,
          null,
          {
            "interactive": false,
            "permanent": false,
            "direction": "auto",
            "opacity": 1,
            "offset": [0, 0],
            "textsize": "10px",
            "textOnly": false,
            "className": "",
            "sticky": true
          },
          null
        ]
      }
    ],
    "limits": {
      "lat": [37.19722, 37.19722],
      "lng": [-3.62444, -3.62444]
    }
  },
  "evals": [],
  "jsHooks": []
}
</script>

HTML, JavaScript

<div class="leaflet html-widget html-fill-item" 
     id="htmlwidget-9caa0b9adf697efa211d" 
     style="width:100%;height:576px;">
</div>

<script>
  const map = L.map('htmlwidget-9caa0b9adf697efa211d', {
    crs: L.CRS.EPSG3857
  }).setView([37.19722, -3.62444], 15);

  L.tileLayer.wms("https://www.ign.es/wms-inspire/ign-base", {
    layers: 'IGNBaseTodo',
    format: 'image/png',
    transparent: false,
    version: '1.1.1',
    attribution: 'IGN'
  }).addTo(map);

  const marker = L.marker([37.19722, -3.62444], {
    interactive: true,
    draggable: false,
    keyboard: true,
    title: "ETSIIT-UGR",
    alt: "ETSIIT-UGR",
    zIndexOffset: 0,
    opacity: 1,
    riseOnHover: false,
    riseOffset: 250
  }).addTo(map);

  marker.bindPopup("ETSIIT-UGR", {
    interactive: false,
    permanent: false,
    direction: "auto",
    opacity: 1,
    offset: [0, 0],
    className: "",
    sticky: true
  });
</script>

Leaflet

  • Biblioteca JavaScript para Mapas

  • Interactiva

  • Marcadores y figuras

  • Datos en GeoJSON

  • Acceso a servidores WMS, OpenStreetMap, Google Maps

  • Extensible

  • Software libre

Bibliotecas JavaScript para Mapas


Característica Leaflet OpenLayers Google Maps API Mapbox GL JS
Tipo Software libre Software libre Privativo Privativo
Coste Gratis Gratis Según uso (1º gratis) Según uso (1º gratis)
Facilidad de Uso Intuitivo y ligero Compleja, orientada a GIS avanzado Interfaz bien documentada Moderada, con opciones avanzadas
Mapas base No No
Def. Estilo Limitada Muy amplia Amplia Muy amplia
Soporte 3D Plugins Sí (complejo)
Rendimiento Bueno (mapas simples) Excelente, pero puede ser pesado Bueno (optimizado para carga rápida) Muy bueno (usa WebGL)
Plugins Muchos plugins Limitado, pero extensible Extensiones propias Variedad
Formatos Básico (plugins) Excelente Limitado (propios) Moderado
Uso Mapas simples Mapas avanzados Aplicaciones comerciales Mapas personalizables

Servidor Web

Servidor Web propio

Modelos de distribución Cliente-Servidor

Desarrollo back-end

  • PHP

  • Java

  • .NET

  • Python (Django)

  • R (Shiny)


  • SGBD
    • MySQL Spatial
    • PostGIS

Hitos en la historia

  • Años 1990:
    • 1990: Web (Tim Berners-Lee)
    • 1993: servidor de mapas, Xerox PARC Viewer
    • 1994: atlas digital en línea, Atlas Nacional de Canadá
  • Años 2000: Web Mapping
    • 2000-2004: OGC
    • 2000 y 2003: MapServer y GeoServer
    • 2001: Google Earth
    • 2004: OSM
    • 2005: Google Maps (AJAX)
    • 2006-2008: APIs de mapas (Google, Microsoft, Yahoo)
    • 2008 y 2011: OpenLayers y Leaflet

Conclusiones