Come creare mappe stilizzate personalizzate utilizzando OpenStreetMap: 7 passaggi (con immagini)

2024 Autore: John Day | [email protected]. Ultima modifica: 2024-01-30 10:01

In questo tutorial, descriverò un processo attraverso il quale puoi generare le tue mappe stilizzate personalizzate. Una mappa stilizzata è una mappa in cui l'utente può specificare quali livelli di dati vengono visualizzati, nonché definire lo stile con cui viene visualizzato ogni livello. Descriverò prima il processo attraverso il quale è possibile scrivere software per stilizzare le mappe, seguito da un esempio del software Python che ho scritto per eseguire questa operazione.

Il seguente video mette in evidenza come genero personalmente mappe stilizzate, ma continua a leggere per i dettagli intimi. Non vedo l'ora di vedere cosa crea la community!

Qual è la mia motivazione dietro questo progetto?

Francamente, ho iniziato questo progetto perché pensavo che sarebbe stato divertente da realizzare. Questa idea mi frullava per la testa nell'ultimo anno e finalmente mi sono preso il tempo di cui avevo bisogno per realizzarla. Dopo una giornata di prototipazione con alcuni script di base, sono stato in grado di generare risultati estremamente promettenti, così promettenti che sapevo di dover formalizzare i miei script in modo che altri potessero facilmente realizzare le proprie creazioni.

La mia motivazione nello scrivere questo tutorial è dovuta al fatto che ho trovato informazioni molto minime su come creare da zero le tue mappe stilizzate. Spero di condividere ciò che ho imparato con la community.

Risorse/Link:

• ApriStreetMap
• OpenStreetMap Legale
• Repository Github

Forniture

• Una distribuzione Python (ho usato Anaconda e Python 3.6)
• PyQt5 (per le dipendenze della GUI)

Passaggio 1: definizione del processo I: download del file OSM

Quando ho iniziato questo progetto, la domanda più lampante era "dove posso trovare i dati delle mappe". Naturalmente, come prevedibile, ho subito pensato a Google Maps. Dopo una ricerca significativa, ho scoperto che Google non vuole che le persone giochino con i propri dati, in senso creativo o meno. In effetti, non consentono esplicitamente lo scraping web da Google Maps.

Fortunatamente, la mia disperazione è stata di breve durata quando ho scoperto OpenStreetMap (OSM). OSM è un progetto collaborativo che coinvolge persone di tutto il mondo che forniscono dati. OSM consente esplicitamente l'utilizzo a tempo indeterminato dei propri dati in nome di software Open Source. Pertanto, visitando la pagina Web di OSM inizia il viaggio di stilizzazione della mappa.

Dopo essere arrivato al sito Web di OSM, fare clic sulla scheda "Esporta" per visualizzare gli strumenti di esportazione della mappa. Ora, ingrandisci per visualizzare la regione con cui sei interessato a raccogliere i dati della mappa. Seleziona il link "Seleziona manualmente un'area diversa", che farà apparire una casella sullo schermo. Forma e posiziona questa casella sulla regione di interesse. Una volta soddisfatto, fai clic sul pulsante "Esporta" per scaricare il file di dati OSM.

Nota 1: se la regione selezionata contiene troppi dati, riceverai un errore che indica che hai selezionato troppi nodi. Se ciò accade a te, fai clic sul pulsante "Overpass API" per scaricare il file più grande.

Nota n. 2: se il file OSM scaricato è più grande di 30 MB, il programma Python che ho scritto rallenterà notevolmente. Se sei determinato a utilizzare una regione di grandi dimensioni, prendi in considerazione la possibilità di scrivere uno script per eliminare i dati superflui che non hai intenzione di disegnare.

Passaggio 2: definizione del processo II: comprensione dei dati

"Ho i dati… e adesso?"

Inizia aprendo il file OSM scaricato nel tuo software di modifica del testo preferito. Noterai per prima cosa che questo è un file XML, il che è fantastico! XML è abbastanza facile da analizzare. L'inizio del file dovrebbe essere quasi identico alla prima immagine di questo passaggio: verranno elencati alcuni metadati di base e confini geografici.

Mentre scorri il file, noterai tre elementi di dati utilizzati in tutto:

1. nodi
2. Modi
3. Relazioni

L'elemento di dati più elementare, un nodo ha semplicemente un identificatore univoco, latitudine e longitudine associati ad esso. Naturalmente, ci sono metadati aggiuntivi, ma possiamo tranquillamente scartarli.

I modi sono raccolte di nodi. Una via può essere resa come una forma racchiusa o come una linea aperta. I modi consistono in un insieme di nodi identificati dal loro identificatore univoco. Sono contrassegnati da chiavi che definiscono il gruppo di dati a cui appartengono. Ad esempio, il modo illustrato nella terza immagine sopra appartiene al gruppo di dati "luogo" e al suo sottogruppo "isola". In altre parole, questo modo particolare appartiene allo strato "isola" sotto il gruppo "luogo". I modi hanno anche identificatori univoci.

Infine, le relazioni sono raccolte di modi. Una relazione può rappresentare una forma complessa con fori o con più regioni. Le relazioni avranno anche un identificatore univoco e saranno contrassegnate in modo simile ai modi.

Puoi leggere di più su questi elementi di dati dal wiki di OSM:

• nodi
• Modi
• Relazioni

Passaggio 3: definizione del processo III: digestione dei dati

Ora dovresti avere almeno una comprensione superficiale degli elementi di dati che compongono un file OSM. A questo punto, siamo interessati a leggere i dati OSM usando la tua lingua preferita. Sebbene questo passaggio sia incentrato su Python, se non vuoi usare Python, dovresti comunque leggere questa parte in quanto contiene alcuni suggerimenti e trucchi.

Il pacchetto xml è incluso per impostazione predefinita con la maggior parte delle distribuzioni Python standard. Useremo questo pacchetto per analizzare molto facilmente il nostro file OSM come mostrato nella prima immagine. In un unico ciclo for, è possibile elaborare la gestione dei dati OSM per ogni particolare elemento di dati.

Nell'ultima riga dell'immagine, noterai che controllo il tag "bounds". Questo passaggio è di vitale importanza per tradurre i valori di latitudine e longitudine in pixel sullo schermo. Consiglio vivamente di eseguire questa conversione al momento del caricamento del file OSM, poiché la conversione di massa dei dati richiede un'elevata intensità di processo.

Parlando di convertire latitudini e longitudini in coordinate dello schermo, ecco un collegamento alla funzione di calcolo che ho scritto. Probabilmente noterai qualcosa di un po' strano nel convertire la latitudine in coordinate dello schermo. C'è un passo in più coinvolto rispetto alla longitudine! A quanto pare, i dati OSM sono modellati utilizzando il metodo di proiezione Pseudo-Mercator. Fortunatamente, OSM ha qui una fantastica documentazione su questo argomento e fornisce le funzioni di conversione della latitudine per un numero significativo di lingue. Stupendo!

Nota: nel mio codice, la coordinata dello schermo (0, 0) è l'angolo in alto a sinistra dello schermo.

Passaggio 4: implementazione di Python Map Stylizer

Fino a questo punto, ho discusso del file di dati OSM: cos'è, come leggerlo e cosa farne. Ora parlerò del software che ho scritto per affrontare la visualizzazione della mappa stilistica (repo GitHub fornito nell'introduzione).

La mia implementazione specifica si concentra sul controllo dell'utente della pipeline di rendering. Nello specifico, permetto all'utente di selezionare i livelli che desidera visualizzare e come desidera che venga visualizzato quel livello. Come ho brevemente accennato in precedenza, ci sono due classi di elementi renderizzati: elementi di riempimento e elementi di riga. I riempimenti sono definiti solo da un colore, mentre le linee sono definite da colore, larghezza della linea, stile della linea, stile di chiusura della linea e stile di unione della linea.

Quando l'utente apporta modifiche agli stili e alla visibilità dei livelli, le modifiche si riflettono nel widget della mappa a destra. Una volta che un utente ha modificato l'aspetto della mappa in modo soddisfacente, può regolare la dimensione massima della mappa e salvare la mappa come immagine sul suo computer. Salvando un'immagine, verrà salvato anche un file di configurazione dell'utente. Ciò garantisce che un utente possa richiamare e riutilizzare la configurazione utilizzata per generare una particolare immagine in qualsiasi momento.

Passaggio 5: inconveniente dell'implementazione + soluzione

Quando ho iniziato a stilizzare manualmente una mappa, ho imparato che era un processo piuttosto noioso. Offrire all'utente il massimo controllo può essere semplicemente travolgente a causa del gran numero di "manopole" disponibili. Tuttavia, esiste una soluzione semplice, che richiede un po' di script in più.

Ho iniziato identificando a quali livelli sono particolarmente interessato. Ai fini di questo tutorial, diciamo che sono più interessato agli edifici (tutti), ai fiumi, alle autostrade principali e alle strade di superficie. Scriverei uno script in cui creo un'istanza di Configuration, cambio gli stati dei livelli in modo appropriato utilizzando la funzione setItemState() e le costanti definite e impostiamo i colori in base a come vorrei che appaiano i miei livelli utilizzando setValue(). Il file di configurazione risultante che viene salvato può essere copiato nella cartella configs e caricato dall'utente.

Uno script di esempio è nell'immagine sopra. La seconda immagine è un esempio di come sarebbero le funzioni di supporto, e poiché sono praticamente tutte identiche, solo con costanti variabili, ho incluso solo un'immagine di un esempio.

Passaggio 6: aree di miglioramento

Dopo aver riflettuto sulla mia implementazione del software, ho identificato diverse aree che potrebbero essere utili miglioramenti per gli utenti esperti.

1. Rendering dinamico dei livelli. Attualmente, ho un elenco predefinito di livelli che verranno resi, tutto qui. Parte della giustificazione era la difficoltà nel determinare se un livello dovesse essere una linea o un riempimento. Di conseguenza, con quasi tutti i file OSM che apri, verrai accolto con una serie di avvisi sui livelli che non verranno visualizzati. Spesso questi sono così minimi che non è un problema, ma ci sono sicuramente degli strati critici mancanti. Il rendering dinamico dei livelli eliminerebbe questi problemi.
2. Assegnazione dinamica dei livelli. Questo va di pari passo con #1; se si desidera il rendering dinamico del livello, è necessaria l'assegnazione del livello dinamico (ovvero identificare un livello di riempimento rispetto a un livello di linea). Ciò potrebbe ragionevolmente essere realizzato, come ho appreso, perché i Ways il cui primo e ultimo nodo sono gli stessi saranno percorsi chiusi e quindi riempiti.
3. Gruppi di colori. Una mappa stilizzata ha spesso diversi livelli con lo stesso stile e consentire all'utente di modificare lo stile di un gruppo contemporaneamente ridurrebbe notevolmente il tempo impiegato dall'utente a modificare i livelli uno per uno.

Passaggio 7: pensieri conclusivi

Grazie a tutti per aver dedicato del tempo a leggere il mio Instructable. Questo progetto rappresenta il culmine di molte ore di ricerca, progettazione, programmazione e debug. Spero di essere stato in grado di fornire un trampolino di lancio da cui puoi costruire il tuo progetto o costruire su ciò che ho già scritto. Spero anche che i miei difetti e suggerimenti forniscano molti punti da considerare nel tuo design. Se sei meno incline a programmare e più incline a creare opere d'arte, mi piacerebbe vedere cosa fai nei commenti! Le possibilità sono infinite!

Un ringraziamento speciale ai contributori di OpenStreetMap! Progetti come questo non sarebbero possibili senza i loro notevoli sforzi.

Per favore fatemi sapere se avete domande nei commenti!

Secondo classificato nella sfida delle mappe