Manuale Utente
Web GIS – Raggruppamento Carabinieri Biodiversità

🗺️ Manuale Utente Web GIS

Guida completa alle funzionalità del Sistema Informativo Geografico del Raggruppamento Carabinieri Biodiversità. Usa la barra di ricerca o il menu laterale per navigare.

OpenLayers 10 WMS/WFS Export PDF/PNG UTM 32N / EPSG:32632 Geoprocessing Profilo altimetrico
🗺️
Introduzione
Panoramica del sistema
📋Cos'è il Web GIS RGPBIO

Il Web GIS del Raggruppamento Carabinieri Biodiversità è un sistema informativo geografico accessibile da browser, progettato per la visualizzazione, analisi e gestione di dati territoriali relativi alle aree naturali protette gestite dall'Arma.

Il sistema è basato su OpenLayers 10 e integra dati istituzionali da PCN (Portale Cartografico Nazionale), Catasto, SITAP e geoportali regionali.

🗺️
Mappa interattiva
Pan, zoom, rotazione, scala
📏
Misura
Distanze e aree
✏️
Disegno
Punti, linee, poligoni, testo
📂
Carica file
GeoJSON, KML, SHP, GPX
⛰️
Altimetria
Profilo altimetrico interattivo
🖨️
Export
PDF e PNG professionali
🖥️Interfaccia principale

L'interfaccia è divisa in tre aree principali:

  • Pannello sinistro — strumenti operativi: ricerca, misure, disegno, buffer, geoprocessing, coordinate, caricamento file, altimetria, foto.
  • Mappa centrale — visualizzazione interattiva con overlay di bussola, scala e coordinate.
  • Pannello destro — gestione layer: vettoriali, WMS personalizzati, PCN, Catasto, SITAP, WMS regionali.
💡
Le sezioni del pannello sinistro si aprono/chiudono cliccando sull'intestazione. Le sezioni già aperte rimangono visibili fino alla successiva interazione.
🌐Sistema di riferimento

Il Web GIS utilizza il sistema di riferimento EPSG:32632 – UTM Zone 32N basato sul datum WGS84. È il sistema ufficiale adottato per l'Italia continentale.

CRSDescrizioneUso
EPSG:32632WGS84 / UTM Zone 32NCRS interno della mappa
EPSG:4326WGS84 Lat/LonGeocoding, popup coordinate
EPSG:3857Web MercatorBasemap raster (OSM, Bing…)
EPSG:25832ETRS89 / UTM 32NCatasto, SITAP
🔍
Ricerca
Geocoding e navigazione rapida
🔎Ricerca per nome luogo (Geocoding)

Il campo di ricerca nella sezione "Ricerca" consente di trovare qualsiasi località italiana e mondiale usando il servizio Nominatim (OpenStreetMap).

  1. Digita il nome del luogo nel campo di ricerca (es. "Parco Nazionale del Pollino")
  2. Clicca Vai o premi Invio
  3. I risultati appaiono come lista cliccabile
  4. Clicca un risultato per centrare la mappa e aggiungere un marker temporaneo
💡
Inserisci nomi precisi per risultati migliori (comune + provincia, es. "Sorrento, Napoli"). Il geocoding funziona anche con indirizzi completi.
📌Inserimento coordinate manuale

Nella sezione "Inserisci Coordinate" puoi navigare direttamente a coordinate note:

  1. Seleziona il CRS delle coordinate (UTM 32N, WGS84, ecc.)
  2. Inserisci Est/X e Nord/Y nei rispettivi campi
  3. Opzionalmente, inserisci un'etichetta per il marker
  4. Clicca Vai per centrare la mappa e aggiungere un marker
CRSFormato X/EstFormato Y/Nord
UTM 32N (32632)es. 500000es. 4650000
WGS84 (4326)es. 12.4964 (lon)es. 41.9028 (lat)
Web Mercator (3857)es. 1390000es. 5150000
🗺️
Basemap e sfondo
Mappe di sfondo disponibili
🌍Selezione basemap

Nella sezione "Basemap" del pannello sinistro è possibile selezionare la mappa di sfondo:

NomeTipoFonte
OSM StandardVettorialeOpenStreetMap
OSM HumanitarianVettorialeHOT / OpenStreetMap
CartoDB LightVettorialeCarto
Satellite (ESRI)RasterESRI World Imagery
Topo (OpenTopo)RasterOpenTopoMap
Terreno (Stamen)RasterStadia/Stamen
💡
Il checkbox "Spegni tutte le basemap" rende lo sfondo trasparente — utile per esportazioni con sfondo pulito.
🛩️Ortofoto storiche (PCN)

Nella sezione WMS del pannello destro, tra i layer PCN, sono disponibili ortofoto storiche:

  • Ortofoto Colore 2012 — alta risoluzione, colore naturale
  • Ortofoto Colore 2006 — media risoluzione, colore
  • Ortofoto B/N 1988 — bassa risoluzione, bianco/nero storica
  • DTM 20m — Modello Digitale del Terreno a 20 m di risoluzione
📏
Strumenti di misura
Distanze e aree
📏Misura distanza
  1. Clicca Distanza nella sezione "Strumenti"
  2. Clicca sulla mappa per aggiungere punti della linea
  3. Il risultato aggiornato appare in tempo reale sotto i pulsanti
  4. Doppio click per terminare la misurazione
  5. Clicca Pulisci per rimuovere le misure
💡
Le distanze sono calcolate sulla proiezione UTM 32N usando la formula geodetica — valori metrici precisi senza distorsione proiettiva significativa per l'Italia.
🔲Misura area
  1. Clicca Area nella sezione "Strumenti"
  2. Clicca sulla mappa per aggiungere i vertici del poligono
  3. L'area del poligono in formazione appare in tempo reale
  4. Doppio click per chiudere il poligono e finalizzare
  5. Clicca Pulisci per azzerare

Il risultato viene mostrato in per aree piccole e in km² per aree maggiori di 1 km².

✏️
Strumenti di disegno
Annotazioni vettoriali sulla mappa
🖊️Tipi di oggetto disegnabili
Punto
Click singolo sulla mappa
Linea
Click multipli + doppio click per terminare
Poligono
Click multipli, doppio click per chiudere
A
Testo
Click → inserisci testo nel campo Nome
🎨Stile e personalizzazione
  • Colore — seleziona il colore tramite il color picker prima di disegnare
  • Spessore — usa il cursore (1–8 px) per linee e bordi poligoni
  • Opacità — percentuale di riempimento per i poligoni (5%–100%)
  • Nome / Etichetta — testo visualizzato come label sulla feature
💡
Per il testo su mappa: seleziona "A Testo", scrivi il testo nel campo "Nome", poi clicca sulla mappa dove vuoi posizionarlo.

Il pulsante (rosso) annulla la sessione di disegno corrente senza eliminare gli elementi già creati.

Buffer
Zone di influenza attorno a geometrie
Come usare il Buffer

Lo strumento buffer crea zone di influenza a distanza fissa attorno a geometrie esistenti.

  1. Inserisci la distanza in metri nel campo numerico
  2. Clicca Buffer disegno per applicare ai disegni correnti sulla mappa
  3. Oppure clicca Buffer layer per applicare ai layer vettoriali caricati
  4. Il buffer viene aggiunto come nuovo layer vettoriale
💡
I buffer sono calcolati con la libreria Turf.js e restituiti come GeoJSON — esportabili dal pannello layer.
⚙️
Geoprocessing
Operazioni spaziali tra layer
⚙️Operazioni disponibili

Il modulo Geoprocessing permette di eseguire analisi spaziali tra due layer vettoriali (A e B).

OperazioneSimboloRisultato
IntersectArea comune ad A e B
UnionUnione di A e B (geometria completa)
ClipPorzione di A entro i confini di B
Dissolve⬜→⬛Fonde le geometrie di A in un unico poligono
  1. Seleziona il Layer A dal primo menu a tendina
  2. Seleziona il Layer B dal secondo menu (non necessario per Dissolve)
  3. Clicca l'operazione desiderata
  4. Il risultato appare come nuovo layer nel pannello destro
  5. Clicca ⟳ Aggiorna layer se i menu non mostrano i layer più recenti
⚠️
Il geoprocessing funziona solo su layer vettoriali locali (GeoJSON, SHP caricati o disegnati). Non è applicabile a layer WMS raster.
📌
Inserimento coordinate
Navigazione a coordinate note
📌Guida rapida
  1. Apri la sezione "Inserisci Coordinate"
  2. Seleziona il sistema di riferimento dal menu CRS
  3. Inserisci i valori Est (X) e Nord (Y)
  4. Opzionalmente aggiungi un'etichetta per il marker
  5. Clicca Vai per centrare la mappa e aggiungere il marker
💡
Il marker rimane visibile sulla mappa fino al successivo inserimento. Può essere esportato come GeoJSON tramite il pannello layer.
📂
Caricamento file
GeoJSON, KML, KMZ, GPX, SHP
📤Formati supportati
FormatoEstensioneNote
GeoJSON.geojson / .jsonNativo — consigliato
KML.kmlSupporta stili e icone
KMZ.kmzKML compresso con JSZip
GPX.gpxTracce GPS, waypoint
Shapefile.zip (con .shp, .dbf, .prj)ZIP con tutti i file del pacchetto SHP
🖱️Modalità di caricamento

Puoi caricare i file in due modi:

  • Drag & drop — trascina il file nella zona tratteggiata "Trascina qui…"
  • Selezione file — usa il selettore file e poi clicca Carica

Dopo il caricamento, il layer appare nel pannello destro sotto "Layer vettoriali" con controlli di visibilità, stile, zoom e rimozione.

💡
Per gli Shapefile, comprimi in un singolo ZIP i file: .shp, .dbf, .prj, .shx. Il file .prj è necessario per la reproiezione automatica.
⬇️Esportazione layer vettoriali

Da ogni layer nel pannello destro è possibile:

  • Esporta GeoJSON — scarica il layer in formato GeoJSON
  • Tabella attributi — visualizza gli attributi di tutte le feature
  • Rimuovi — elimina il layer dalla mappa
⛰️
Profilo altimetrico
Analisi del rilievo lungo un percorso
✏️Tracciamento su mappa
  1. Apri la sezione "Profilo altimetrico"
  2. Clicca ✓ Disegna linea
  3. Clicca sulla mappa per tracciare il percorso (doppio click per terminare)
  4. Il profilo viene calcolato e mostrato in un pannello mobile
  5. Clicca ✕ Pulisci per azzerare
💡
Il pannello del profilo è trascinabile — puoi riposizionarlo ovunque nello schermo tenendo premuto l'intestazione.
📂Profilo da layer esistente
  1. Carica un layer lineare (GPX, GeoJSON con LineString)
  2. Selezionalo dal menu "Da layer caricato"
  3. Clicca Calcola
📊Statistiche e export

Il pannello altimetrico mostra:

  • Distanza totale del percorso
  • Quota minima e massima
  • Dislivello positivo (+) e negativo (−)
  • Pendenza media

I pulsanti 📷 PNG e 📄 PDF esportano il grafico del profilo.

Fonte dati quota: Open-Meteo Elevation API (SRTM/DEM globale, risoluzione ~90m).

📷
Foto georeferenziate
Posizionamento immagini sulla mappa
📷Immagini con GPS incorporato
  1. Trascina le immagini nella zona "Trascina JPG/PNG/WebP qui" o usa il selettore file
  2. Clicca Aggiungi
  3. Le immagini con coordinate EXIF GPS vengono posizionate automaticamente
  4. Cliccando sul marker sulla mappa si apre l'anteprima dell'immagine
💡
Funziona con foto scattate da smartphone con GPS attivo. I metadati EXIF vengono letti direttamente nel browser, senza invio a server.
📌Posizionamento manuale
  1. Usa il selettore "Immagine senza GPS"
  2. Clicca ✏ Manuale
  3. Clicca sulla mappa nel punto desiderato
  4. L'immagine viene posizionata alle coordinate cliccate

Il pulsante ✕ Annulla posizionamento permette di uscire dalla modalità manuale.

🇮🇹
PCN – Ministero Ambiente
Portale Cartografico Nazionale
🌐Layer disponibili

Il pannello destro PCN integra centinaia di layer dal Portale Cartografico Nazionale del Ministero dell'Ambiente:

  • Carte topografiche (CTR, IGM)
  • Limiti amministrativi (comuni, province, regioni)
  • Aree naturali protette (parchi nazionali, SIC, ZPS)
  • Reticolo idrografico
  • Uso del suolo (Corine Land Cover)
  • Ortofoto 1988, 2006, 2012
  • DTM 20m
💡
Usa il campo "Filtra layer PCN…" per cercare rapidamente tra i centinaia di layer disponibili. Il filtro è case-insensitive.
⚙️Controllo trasparenza WMS

Il cursore "Trasparenza WMS" nella sezione PCN controlla l'opacità globale di tutti i layer WMS attivi. Il valore predefinito è 85%.

🏘️
Catasto
Dati catastali – Agenzia delle Entrate
🏘️Layer catastali

La sezione Catasto integra i servizi WMS dell'Agenzia delle Entrate tramite il WMS ufficiale GEOSERVER:

  • Mappa catastale (particelle, fabbricati)
  • Confini catastali
  • Fogli di mappa
  • Numeri particelle

Dati disponibili a scala di dettaglio (zoom > 1:5.000). La fonte è il WMS pubblico CC BY 4.0 dell'AdE.

🏛️
SITAP – Vincoli paesaggistici
D.Lgs 42/2004 – Ministero della Cultura
🏛️Vincoli paesaggistici

Il SITAP (Sistema Informativo Territoriale Ambientale e Paesaggistico) offre la cartografia dei vincoli paesaggistici ai sensi del D.Lgs 42/2004:

  • Aree tutelate per legge (art. 142): corsi d'acqua, montagne, boschi, zone costiere…
  • Aree soggette a vincolo diretto (art. 136): immobili e aree di notevole interesse
  • Piani paesaggistici regionali

Fonte: Ministero della Cultura (MiC) – SITAP.

🗾
WMS Regionali & Enti
Geoportali regionali, ISPRA, Bacini
🗾Fonti disponibili

Il pannello "WMS Regionali & Enti" integra layer da geoportali istituzionali italiani:

  • Geoportali regionali — cartografie ufficiali di tutte le regioni
  • ISPRA — Istituto Superiore per la Protezione e la Ricerca Ambientale
  • Autorità di Bacino Distrettuali — piani assetto idrogeologico (PAI)
  • Reti ecologiche, habitat, flora/fauna
💡
Usa il campo "Filtra layer regionali…" per navigare tra i centinaia di layer disponibili da tutti gli enti.
WMS personalizzati
Aggiungi qualsiasi servizio WMS esterno
Aggiungere un WMS esterno
  1. Copia l'URL del servizio WMS (es. https://host.it/wms?)
  2. Incollalo nel campo "WMS personalizzati" nel pannello destro
  3. Clicca Aggiungi WMS
  4. Il sistema interroga il GetCapabilities e mostra i layer disponibili
  5. Spunta i layer desiderati e clicca Aggiungi selezionati
⚠️
I WMS esterni potrebbero avere restrizioni CORS. In quel caso è necessario che il proxy /gis/proxy.php sia attivo sul server.
🖨️
Esportazione PDF / PNG
Layout Manager avanzato QGIS-like
🚀Apertura e interfaccia

Clicca il pulsante 🖨️ Esporta in basso nel pannello sinistro. Si apre il Layout Manager Avanzato con due aree principali:

  • Pannello sinistro — impostazioni: formato, preset, testi, scala, elementi, loghi, legenda
  • Anteprima layout — canvas interattivo con gli elementi posizionabili
📄Formati di pagina
FormatoDimensioneOrientamento
A4 Orizzontale297 × 210 mmLandscape
A4 Verticale210 × 297 mmPortrait
A3 Orizzontale420 × 297 mmLandscape
A3 Verticale297 × 420 mmPortrait
A2 Orizzontale594 × 420 mmLandscape
A2 Verticale420 × 594 mmPortrait
🎯Preset layout
Classico
Mappa grande, legenda sovrapposta, intestazione e piè di pagina
Legenda destra
Mappa a sinistra (66%), legenda in colonna destra
Compatto
Mappa massimizzata, elementi in basso

Il pulsante ⟳ Ripristina layout riporta tutti gli elementi alle posizioni predefinite.

🖱️Posizionamento elementi
  • Trascina qualsiasi blocco nell'anteprima per riposizionarlo liberamente
  • 8 handle di ridimensionamento appaiono su ogni blocco selezionato (angoli + medi)
  • Guide di allineamento rosse appaiono durante il trascinamento quando i bordi si allineano ad altri elementi
  • Snap griglia (0.5%) — attivabile/disattivabile dal checkbox "Snap griglia"
  • Snap magnetico ai bordi degli altri elementi (attrazione automatica a 0.9%)
  • Pannello proprietà X/Y/W/H — valori percentuali modificabili numericamente
💡
Gli elementi possono sovrapporsi liberamente — nessun vincolo di non-overlap. Il pannello Elementi layout abilita/disabilita ogni blocco con il checkbox.
🏛️Loghi (3 slot)

Sono disponibili 3 slot logo indipendenti. Per ogni slot:

  1. Clicca sullo slot o trascina un'immagine direttamente
  2. Il logo appare nel blocco corrispondente nell'anteprima layout
  3. Il blocco logo deve essere abilitato nel pannello "Elementi layout"

I loghi PNG con trasparenza vengono esportati senza sfondo bianco nel PDF. Il canale alpha è preservato nativamente da jsPDF.

📋Editor legenda
  • Clicca ⟳ Aggiorna per caricare i layer visibili nella legenda
  • Abilita/disabilita singole voci con il checkbox
  • Rinomina le voci modificando il testo nel campo adiacente
  • Riordina trascinando le righe con la maniglia
⚙️Rendering corretto della mappa

Il sistema di export attende il completo caricamento dei tile WMS prima di catturare la mappa:

  • Monitoraggio eventi tileloadstart/tileloadend per ogni sorgente
  • Stabilizzazione dopo 450ms senza nuove richieste tile
  • Timeout di sicurezza 12 secondi (procede comunque)

Il canvas mappa viene ritagliato in modalità COVER per riempire esattamente il box del layout — nessuna barra grigia, nessuna distorsione.

⚠️
I layer WMS cross-origin senza proxy attivo producono un export bianco o parziale. In questo caso usa la Cattura schermata (sezione successiva) come soluzione alternativa completa.
🔒Problema CORS e layer WMS (export bianco)

I browser moderni applicano la politica Same-Origin Policy: se un'immagine WMS proviene da un dominio diverso rispetto alla pagina web, il canvas HTML5 viene marcato come "tainted" (contaminato).

Un canvas tainted non può essere esportato via toDataURL() — il browser blocca l'operazione per motivi di sicurezza. Il risultato è un export con la mappa bianca o con solo la basemap.

SituazioneExport standardSoluzione
Solo basemap (OSM, satellite…)✅ Funziona
Layer WMS tramite proxy /gis/proxy.php✅ FunzionaIl proxy aggiunge header CORS
Layer WMS senza proxy (cross-origin)❌ Bianco/parzialeUsa 📸 Cattura schermata
💡
Il proxy del sistema (/gis/proxy.php) risolve automaticamente il problema CORS per i WMS istituzionali (PCN, Catasto, SITAP, WMS regionali). Per WMS di terze parti non instradati dal proxy, usa la cattura schermata.
🖨️Avviare l'export
  1. Configura il layout (formato, testi, elementi)
  2. Clicca 📄 PDF per export PDF professionale con tutti gli elementi
  3. Oppure clicca 📷 PNG per export dell'immagine mappa con intestazione
  4. Il pulsante mostra "⏳ Elaborazione…" durante il rendering
  5. Il file viene scaricato automaticamente come mappa_rgpbio.pdf o mappa_rgpbio.png
📸
Cattura schermata
Soluzione alternativa per export con layer WMS cross-origin
Quando usare la cattura schermata

La Cattura schermata è la soluzione consigliata quando l'export standard (PDF/PNG) produce una mappa bianca o incompleta a causa di layer WMS cross-origin non accessibili tramite il proxy.

A differenza dell'export standard — che legge i dati pixel dal canvas HTML5 — la cattura schermata utilizza la Screen Capture API del browser (getDisplayMedia) per fotografare visualmente la scheda del browser, producendo sempre un'immagine completa di tutto ciò che è visibile.

Cattura schermata
Tutto ciò che vedi viene catturato — WMS, basemap, overlay
⚠️
Export standard
Può fallire su WMS cross-origin (canvas tainted)
📋Guida passo-passo
  1. Apri la finestra di export cliccando 🖨️ Esporta nel pannello sinistro
  2. Configura il layout come desideri (titolo, formato, elementi)
  3. Nel pannello impostazioni, spunta l'opzione 📸 Cattura schermata (consigliato WMS)
  4. Oppure clicca direttamente il pulsante 📸 Cattura nell'intestazione della finestra
  5. La finestra di export si nasconde automaticamente
  6. Il browser mostra la finestra di condivisione schermo: seleziona "Questa scheda" e clicca Condividi
  7. Il sistema attende che lo schermo sia stabile, poi cattura l'immagine automaticamente
  8. La finestra di export riappare con il file pronto per il download
💡
Nella finestra di condivisione del browser, seleziona sempre "Scheda del browser" (non "Schermo intero" né "Finestra app") — in questo modo viene catturata solo la scheda del GIS.
🖼️Cosa viene catturato

La cattura schermata fotografa la viewport della mappa (l'area visibile dello schermo) e aggiunge automaticamente in sovrimpressione:

  • Barra del titolo — in basso, con titolo, data, CRS e autore
  • Pannello legenda — in alto a destra, con i layer visibili
  • Scala grafica — in basso a sinistra, calibrata sulla scala corrente

La finestra di export e tutti gli overlay dell'interfaccia vengono nascosti automaticamente prima della cattura: nell'immagine finale appare solo la mappa.

💡
Per ottenere la migliore qualità, massimizza la finestra del browser prima di avviare la cattura. La risoluzione dipende dalla dimensione fisica della scheda.
📄Output: PNG e PDF

La cattura può produrre entrambi i formati:

  • PNG — immagine raster ad alta risoluzione, pronta per presentazioni e reportistica
  • PDF — documento con la mappa catturata, inclusi titolo e metadati, formato A4/A3 come impostato nel layout

Il tag del file indica sempre la modalità usata: "Cattura schermo" per la cattura API, "Snapshot schermo" per la modalità canvas diretta.

🔒Requisiti e compatibilità
BrowserSupportoNote
Chrome / Edge (v94+)✅ CompletoSupporta preferCurrentTab
Firefox (v116+)✅ ParzialeRichiede selezione manuale della scheda
Safari❌ Non supportatoAPI non disponibile
⚠️
Se il browser non supporta la Screen Capture API, il pulsante "Cattura" è disabilitato e il sistema usa automaticamente la modalità Snapshot canvas. La funzione è disponibile solo su connessioni HTTPS o localhost.
🔒
La cattura schermata richiede un gesto utente esplicito (click sul pulsante) per motivi di sicurezza — il browser non può catturare lo schermo in modo silenzioso senza il consenso dell'utente.
⚙️Confronto metodi di export
MetodoQualitàWMS cross-originPersonalizzazioneUso consigliato
Export standardAlta (DPI configurabile)⚠️ Dipende dal proxyLayout completoBasemap + layer proxy
Snapshot canvasAlta (canvas directo)⚠️ Solo layer CORS-safeOverlay cartograficoFallback rapido
Cattura schermataMedia (viewport)✅ Sempre funzionaOverlay cartograficoWMS cross-origin
⌨️
Scorciatoie da tastiera
Riferimento rapido
⌨️Tutte le scorciatoie
Tasto / CombinazioneFunzione
+ / =Zoom in
-Zoom out
Pan mappa
RReset rotazione Nord-up
Shift + trascinaBox zoom su area selezionata
Alt + trascinaRuota la mappa
Doppio clickZoom in centrato + termina disegno
Invio in RicercaAvvia geocoding
EscAnnulla modalità corrente (disegno, buffer…)