catasto con leaflet

Come visualizzare le mappe catastali dell’AdE con Leaflet

‌Quando circa un anno fa l’Agenzia delle Entrate (AdE) ha reso disponibili le mappe catastali di tutto il territorio nazionale con un servizio WMS 1.3.0, la notizia è stata accolta con entusiasmo da coloro che operano nel settore. Da allora è stato un susseguirsi di tutorial su questo servizio e di esempi di applicazioni che lo utilizzano, tra le quali molte web map.

Anche noi vogliamo dare il nostro piccolo contributo e spiegare, quanto più semplicemente possibile, come visualizzare queste mappe  su una web map utilizzando LeafletJS.

Una premessa importante per chiunque voglia usare queste mappe, è che l’AdE ne consente la consultazione con licenza CC-BY-NC-ND 4.0 che, se andate a guardare è molto limitativa. Perciò anche noi, spiegheremo come visualizzarle con LeafletJS, rimanendo nell’ambito di tale licenza ed invitandovi di fare altrettanto.

Come già detto, la visualizzazione delle mappe catastali viene erogata come servizio WMS, il che vuol dire anche che si tratta di immagini dei fogli e delle particelle catastali e non di elementi vettoriali con dati associati. Le uniche informazioni ricavabili sono quelle fornite con la richiesta GetFeatureInfo implementata sul layer delle particelle e di cui parleremo più avanti.

Tutte le informazioni  che riguardano le modalità di erogazione delle mappe catastali WMS, le trovate in questa pagina del sito AdE; qui trovate anche il manuale PDF con i dettagli tecnici che servono ad un client WMS per visualizzarle. Di seguito vi riportiamo le informazioni più importanti.

URL del servizio WMShttps://wms.cartografia.agenziaentrate.gov.it/inspire/wms/ows01.php

URL richiesta GetCapabilitieshttps://wms.cartografia.agenziaentrate.gov.it/inspire/wms/ows01.php?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetCapabilities

Formati: image/png, image/jpg;

Layers (livelli)CP.CadastralParcel (particelle), CP.CadastralZoning (fogli o mappe), fabbricati, acque, strade, province, vestizioni;

Sistemi di riferimento (CRS) EPSG: 6706, 4258, 258322583325834.

La classe L.tilelayer.wms

Fatte queste premesse,  vediamo come si possono visualizzare questi layer catastali usando Leaflet. La classe Leaflet per visualizzare dei layer WMS è L.tilelayer.wms  che funziona specificando l’URL del servizio e le eventuali opzioni che servono per definirlo.

Il seguente esempio è la definizione di un layer WMS della carta geologica dell’Italia (scala 1:500.000) fornito dal PCN (Portale Cartografico Nazionale):

notiamo la presenza del parametro layers che specifica il nome del layer da visualizzare; se sono più d’uno, i nomi vanno indicati nel seguente modo:

Un’altra opzione importante di L.tilelayer.wms è crs con la quale si specifica il CRS (Coordinate Reference System) con cui il server WMS ci trasmetterà l’immagine/mappa; se non viene indicato si sottintende che è quello di default  e cioè l’ EPSG 3857.
Quindi la definizione del layer WMS dell’esempio di prima equivale a scrivere:

Attenzione ad assicurarsi che l’ EPSG scelto, sia tra quelli previsti dal servizio WMS che stiamo interrogando;  se non sappiamo quali sono, con una richiesta GetCapabilities possiamo leggere quali sono. Per esempio ecco alcuni dei CRS disponibili con il servizio WMS della carta geologica:

Se nella definizione del L.tileLayer.wms dovessimo specificare un CRS che non è tra quelli previsti dal servizio WMS, non si vedrebbe nulla!
E’ proprio per questo che, se definiamo un  layer del servizio catastale nel seguente modo:

non funzionerà, perchè si sottintende che richiediamo il servizio con CRS EPSG:3857 , che non è tra quelli supportati dal WMS dell’ AdE che abbiamo visto prima. Tra questi, possiamo scegliere allora  l’ ESPG:6706 che corrisponde al recente sistema di coordinate geografiche RDN2008 ovvero il sistema ETRF2000 all’epoca 2008.0 materializzato dalla RDN (Rete Dinamica Nazionale).

Definizione del CRS EPSG:6706

Purtroppo nè l’EPSG:6706 nègli altri (4258, 25832, 25833, 25844) sono tra i CRS predefiniti in Leaflet; pertanto, prima di poterlo usare, lo dobbiamo definire usando le librerie proj4.js e proj4lealfet.js. Come sempre, per usare delle librerie aggiuntive, dobbiamo linkare nella pagina della nostra web map i riferimenti necessari, per esempio usando delle CDN:

  • https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.5.0/proj4.js
  • https://cdnjs.cloudflare.com/ajax/libs/proj4leaflet/1.0.2/proj4leaflet.js

La definizione di un CRS  richiede di conoscere innanzitutto la sua dichiarazione in formato proj4; questa insieme ad altre informazioni utili, li possiamo trovare sul sito epsg.io. Nel nostro caso, per l’ EPSG 6706 la pagina è questa: epsg.io/6706 . Qui troviamo che la sua stringa proj4 è:

e poi troviamo anche le coordinate (espresse in WGS84) dell’estensione geografica (bounding box) per la quale è definito.

estensione EPSG 6706

Noti questi parametri, ecco come si definisce il CRS usando la classe L.Proj.CRS :

Non abbiamo ancora assegnato il valore della proprietà resolutions che prima spieghiamo cosa rappresenta. Si tratta dei fattori di risoluzione (metri/pixel) delle tiles che compongono una mappa espressa con tale CRS, per i vari livelli di zoom (0, 1, 2, 3, … etc).
Ora, senza stare qui a spiegare come si compone in tiles una immagine/mappa, tenuto conto che usiamo tile di dimensione 1024×1024, con il seguente codice calcoliamo i fattori di risoluzione per questo CRS e per i livelli di zoom da 0 a 21:

e quindi nella definizione del crs_6706 scritta prima, andremo ad assegnare la proprietà resolutions (è un vettore):

Definizione dei layer WMS del catasto

Adesso possiamo definire correttamente i layer WMS del catasto  in questo modo:

in questo esempio, abbiamo indicato il layer delle particelle catastali (nome layer: CP.CadastralParcel), ma ovviamente vale la stessa cosa per tutti gli altri layer.  Notate anche l’aggiunta dell’ opzione transparent: true (consentito solo per il formato image/png) che, pur non indispensabile, è utile per vedere il layer catastale sovrapposto ad una basemap del territorio nazionale. E poi importante anche l’ attribution con la quale si rende manifesto il fornitore del servizio (AdE) e la licenza di rilascio.
Cliccando sul seguente bottone potete  guardare un esempio completo.

webmap esempio

Se vogliamo realizzare una web map che visualizza tutti i layer del servizio catastale, possiamo definire un solo layer WMS con tutti i layer previsti, cioè così:

Tenete conto che, come specificato nel manuale d’uso, i layer del Catasto diventano visibili solo a partire da un certo valore della scala, ovvero sopra un certo valore del livello di zoom. Per come abbiamo definito le risoluzioni del sistema crs_6706, risulta  che:

  • i fogli catastali (CP.CadastralZoning) sono visibili a partire dal livello zoom 12;
  • le particelle catastali (CP.CadastralParcel) sono visibili a partire dal livello zoom 17;
  • le acque risultano visibili a partire dal livello zoom 14.
  • … etc … etc

L’altra soluzione è definire un layer WMS distinto per ogni layer del Catasto:

e poi accendere/spegnere la loro visualizzazione sulla web map con un selettore di layer. Un esempio è il seguente (click sul bottone):
webmap esempio

La richiesta GetFeatureInfo

Una prerogativa utile del servizio WMS del Catasto è la possibilità di effettuare delle richieste GetFeatureInfo  per il il layer delle particelle e dei fogli (o mappe), ovvero, anche se si tratta di layer raster, ottenere informazioni sui singoli elementi che li compongono.

catasto getfeatureinfo

La richiesta GetFeatureInfo non è prevista nel core di Leaflet, e quindi bisogna usare altre librerie che la implementano oppure scriversi direttamente il codice che la realizza e noi seguiremo questa seconda strada. Quello che vedete di seguito è un esempio di URL che effettua una richiesta GetFeatureInfo con tutti i parametri necessari:

In rete trovate diverse soluzioni JS per generare un URL del genere; noi ne abbiamo trovato una relativamente semplice che, con qualche piccola modifica, abbiamo adattato per i nostri scopi, questo è il codice:

Questa funzione GetFeatureInfoUrl richiede in ingresso i seguenti parametri:

  • map: è l’oggetto mappa sulla quale viene rappresentato il layer WMS;
  • layer: è il layer WMS per il quale eseguiamo le richieste GetFeatureInfo;
  • latlng: sono le coordinate del punto che clicchiamo,  cioè del punto che interroghiano;
  • crs: è il CRS adoperato per rappresentare il layer WMS (nel nostro caso l’ EPSG:6706)

Adoperando questa funzione e traendo spunto da quanto ha realizzato Enrico Ferreguti per OpenLayers (navigatore del servizio WMS di cartografia catastale), abbiamo scritto il seguente codice per eseguire delle richieste GetFeatureInfo su un qualunque layer WMS che le prevede:

Senza scendere nei dettagli spieghiamo alcune cose. Innanzitutto per inviare la richiesta GetFeatureInfo al server WMS abbiamo usato l’oggetto AJAX XMLHttpRequest e se volete altre informazioni le trovate in questa pagina. Quando la risposta del server è corretta, il risultato (xhttp.responseText) viene presentato nel popup che si aprirà in corrispondenza del punto cliccato sulla mappa.

L’URL generato dalla funzione GetFeatureInfoUrl non viene usato direttamente, ma attraverso un API (cors-anywhere.herokuapp.com) che permette di by-passare il problema delle policy di CORS (Cross-Origin Resource Sharing); brevemente spieghiamo di cosa si tratta. Quando si cerca di accedere a risorse servite su un dominio diverso da quello da cui origina il nostro client, i browser per questioni di sicurezza, bloccano le richieste. Nel nostro caso, questo succederebbe alle richieste AJAX fatte con XMLHttpRequest.

CORS error

Ci sono diverse soluzioni perquesto problema; se si può agire sul server a cui vengono inviate le richieste, devono essere abilitati gli header CORS, con la quale comunica al browser che si assume la responsabilità di far accedere a risorse che sono al di fuori del proprio dominio.

Ma normalmente non si può intervenire sul server e quindi ci sono soluzioni alternative. Una è  quella di inviare le richieste tramite un proxy-server che fa da tramite e quando restituisce al browser la risposta del server WMS, ci aggiunge gli header CORS; questo è proprio quello che fa il servizio cors-anywhere.herokuapp.com.

catasto WMS getfeatureinfo

Abbiamo realizzato una paginetta di esempio , rappresentando solo il layer delle particelle catastali; facendo click in qualunque punto della mappa dove c’è una particella, dopo qualche secondo (la risposta del server non è immediata anche perchè c’è di mezzo il proxy) compare un popup con il risultato della richiesta GetFeatureInfo relativo alla particella in quel punto. Per vedere l’esempio cliccate sul seguente bottone:

webmap esempioE per vedere il suo codice sorgente completo, basta usare l’apposita funzione (visualizza sorgente pagina) del browser che state usando.

condividi: