Valutazione attuale: 4 / 5

Stella attivaStella attivaStella attivaStella attivaStella inattiva
 
Visualizzare e interrogare le mappe WMS con Leaflet

Indice degli argomenti

Gestire i servizi di mappa web - WMS - in Leaflet. L'utilizzo della classe nativa e del plugin lealfet.wms per l'interrogazione della mappa e la visualizzazione degli attributi delle feature.

Web Map Service

Lo standard OGC Web Map Service (WMS) consiste in una interfaccia basata sul protocollo web HTTP per la richiesta dinamica di immagini di mappe da uno o più database geografici. L'utilizzo del servizio di mappa comporta una richiesta WMS, nella quale sono definiti i layer e l'area geografica di interesse, ed una risposta dal server che consiste in una o più immagini di mappe georeferenziate visualizzabili in una applicazione desktop o in un browser web.

Le immagini di mappa prodotte da un servizio WMS sono fornite generalmente nei formati grafici JPEG, PNG, GIF, ma è previsto anche l'utilizzo di elementi vettoriali in formato Scalable Vector Graphics (SVG) o Web Computer Graphics Metafile (WebCGM). Per i formati di immagine che supportano la trasparenza, quali PNG e GIF, l'interfaccia WMS consente di specificare se le immagini restituite devono essere trasparenti in modo da poter combinare i livelli nella mappa totale.

Lo standard WMS definisce tre operazioni:

  • La richiesta GetCapabilities che ritorna il documento in formato XML dei metadati che descrivono il contenuto informativo del servizio WMS. Le informazioni ottenute sono utilizzate dal client per l'operazione di richiesta GetMap. Attraverso la lettura del documento XML è possibile conoscere la descrizione e le caratteristiche del servizio ed i layer disponibili.
  • La richiesta GetMap che restituisce una immagine di mappa con parametri geospaziali e di dimensione ben definiti.
  • La richiesta opzionale GetFeatureInfo per ottenere le informazioni circa una particolare entità feature mostrata in una mappa.

Leaflet e i servizi WMS

Leaflet, la libreria JavaScript per il web mapping, mette a disposizione la classe nativa L.TileLayer.WMS che, con semplicità, permette di visualizzare le mappe WMS. La classe, però, ha in se alcuni limiti. Non consente, ad esempio, di interrogare la mappa per ottenere le informazioni sulle feature. Ma uno di punti di forza di Leaflet è la disponibilità di numerosi plugin, sviluppati dalla community, che ampliano di molto le funzionalità native della libreria open source. Uno di questi plugin è leaflet.wms che, oltre a fornire un metodo ottimizzato per il caricamento dei layer, supporta il servizio WNS GetFeatureInfo per interrogare le feature della mappa e ottenere le informazioni associate.

Negli esempi che seguono andremo a realizzare con Leaflet una mappa web del dataset WMS del grafo stradale ANAS disponibile dal portale degli open data del Ministero delle Infrastrutture e dei Trasporti (MIT). Vedremo come accedere al servizio WMS attraverso la classe nativa Leaflet oppure come utilizzare il plugin per poter anche interrogare la mappa e visualizzare gli attributi delle feature.

La pagina di anteprima della mappa riporta la URL del servizio WMS:

http://geodata.mit.gov.it/geoserver/nuovastm/wms?service=WMS&version=1.3.0&request=GetCapabilities&layers=nuovastm:grafo_anas_dic2015

Essa è costituita da una base, la GetCapabilities, alla quale seguono le opzioni della mappa. La URL che utilizzeremo nel codice, sia della classe nativa che nel plugin, è la GetCapabilities senza le opzioni:

http://geodata.mit.gov.it/geoserver/nuovastm/wms?

Generalmente un servizio WMS fornisce più di un layer di mappa. Per conoscere il layer disponibili possiamo caricare il WMS in una applicazione GIS desktop, come QGIS, oppure visualizzare il documento XML GetCapabilities contenente i metadati del WMS. Nel nostro esempio, basta puntare con il browser alla URL:

Scorrendo la struttura del documento XML si arriva alla definizione dei layer forniti dal WMS. Ciascun livello è individuato dal tag <Layer> (con relativi attributi) seguito dai tag <Name> e <Title> ed ulteriori tag che specificano le caratteristiche del layer come le keyword, il sistema di coordinate (CRS), i limiti delle coordinate, il formato immagine, etc. Ad esempio:

<Layer queryable="1" opaque="0">
  <Name>anagrafica_autostrade</Name>
  <Title>Anagrafica Autostrade</Title>
  ...
  <CRS>EPSG:4326</CRS>
  <CRS>CRS:84</CRS>
  ...
</Layer>

Dopo aver individuato i layer che desideriamo visualizzare nella mappa web, le denominazioni contenute nei tag <Name> saranno quelle da utilizzare nel codice Leaflet nelle opzioni sia della classe nativa L.TileLayer WMS che delle classi del plugin leaflet.wms.

Nelle due pagine che seguono realizzeremo le mappe in Leaflet utilizzando la classe nativa ed il plugin leaflet.wms.

Segue: La Classe nativa Leaflet L.TileLayer.WMS