Com crear mapes estilitzats personalitzats mitjançant OpenStreetMap: 7 passos (amb imatges)

2024 Autora: John Day | [email protected]. Última modificació: 2024-01-30 08:12

En aquest instructiu, descriuré un procés mitjançant el qual podeu generar els vostres propis mapes estilitzats a mida. Un mapa estilitzat és un mapa on l'usuari pot especificar quines capes de dades es visualitzen, així com definir l'estil amb què es visualitza cada capa. Primer descriuré el procés mitjançant el qual podeu escriure programari per estilitzar mapes, seguit d’un exemple del programari Python que vaig escriure per realitzar aquesta tasca.

El següent vídeo posa de manifest com genera personalment mapes estilitzats, però segueixo llegint per obtenir detalls íntims. Estic molt emocionat de veure què crea la comunitat.

Quina és la meva motivació darrere d’aquest projecte?

Francament, vaig començar aquest projecte perquè pensava que seria divertit fer-ho. Aquesta idea ha tingut un gran ressò en la meva ment durant l’últim any i finalment vaig prendre el temps que necessitava per portar-la a bon port. Després d'un dia de prototipatge amb alguns scripts bàsics, vaig poder generar resultats extremadament prometedors, tan prometedors que sabia que necessitava formalitzar els meus scripts de manera que altres poguessin crear creacions pròpies.

La meva motivació per escriure aquest instructiu es deu al fet que he trobat informació mínima sobre com crear els vostres propis mapes estilitzats des de zero. Espero compartir el que he après amb la comunitat.

Recursos / enllaços:

• OpenStreetMap
• OpenStreetMap Legalese
• Dipòsit de Github

Subministraments

• Una distribució Python (he utilitzat Anaconda i Python 3.6)
• PyQt5 (per a les dependències de la GUI)

Pas 1: definició del procés I: descàrrega del fitxer OSM

Quan vaig començar aquest projecte per primera vegada, la pregunta més fulgurant era: "on puc obtenir dades del mapa"? Naturalment, com era d’esperar, de seguida vaig pensar en Google Maps. Després d’una investigació important, vaig descobrir que Google realment no vol que la gent jugui amb les seves dades, ni en un sentit creatiu ni d’una altra manera. De fet, prohibeixen explícitament el rascat web de Google Maps.

Afortunadament, la meva desesperació va durar poc temps en descobrir OpenStreetMap (OSM). OSM és un projecte col·laboratiu que inclou dades de persones de tot el món. OSM permet explícitament l’ús obert de les seves dades en nom del programari de codi obert. Com a tal, a la pàgina web d’OSM és on comença el viatge d’estilització del mapa.

Després d'arribar al lloc web d'OSM, feu clic a la pestanya "Exporta" per mostrar les eines d'exportació del mapa. Ara, apropeu-vos per veure la regió amb la qual esteu interessat en recopilar dades del mapa. Seleccioneu l'enllaç "Selecciona manualment una àrea diferent", que mostrarà un quadre a la pantalla. Formeu i col·loqueu aquest quadre sobre la regió d’interès. Un cop satisfet, feu clic al botó "Exporta" per descarregar el fitxer de dades OSM.

Nota # 1: si la regió seleccionada conté massa dades, obtindreu un error que indica que heu seleccionat massa nodes. Si us passa això, feu clic al botó "API Overpass" per baixar el fitxer més gran.

Nota # 2: si el fitxer OSM descarregat supera els 30 MB, el programa Python que he escrit disminuirà sensiblement. Si esteu decidit a utilitzar una regió gran, penseu a escriure un script per llençar dades superflues que no teniu previst dibuixar.

Pas 2: definició del procés II: comprensió de les dades

"Tinc les dades … ara què?"

Comenceu obrint el fitxer OSM descarregat al vostre programari d’edició de text preferit. Primer us adonareu que es tracta d’un fitxer XML, que és fantàstic. XML és prou fàcil d’analitzar. L'inici del fitxer hauria de semblar gairebé idèntic a la primera imatge d'aquest pas: es mostraran algunes metadades bàsiques i límits geogràfics.

En desplaçar-vos pel fitxer, notareu tres elements de dades utilitzats al llarg de tot:

1. Nodes
2. Maneres
3. Relacions

L'element de dades més bàsic, un node, simplement té un identificador únic, latitud i longitud associats. Per descomptat, hi ha metadades addicionals, però les podem descartar amb seguretat.

Les formes són col·leccions de nodes. Una manera es pot representar com una forma tancada o com una línia de final obert. Les formes consisteixen en una col·lecció de nodes identificats pel seu identificador únic. S'etiqueten amb claus que defineixen el grup de dades al qual pertanyen. Per exemple, la forma que es mostra a la tercera imatge pertany al grup de dades "lloc" i al seu subgrup, "illa". En altres paraules, aquesta forma particular pertany a la capa "illa" del grup "lloc". Les formes també tenen identificadors únics.

Per últim, les relacions són col·leccions de formes. Una relació pot representar una forma complexa amb forats o amb diverses regions. Les relacions també tindran un identificador únic i s’etiquetaran de manera similar a les formes.

Podeu llegir més sobre aquests elements de dades a la wiki d’OSM:

• Nodes
• Maneres
• Relacions

Pas 3: definició del procés III: digestió de les dades

Ara hauríeu de tenir una comprensió superficial dels elements de dades que formen un fitxer OSM. En aquest moment, ens interessa llegir les dades de l’OSM mitjançant l’idioma que trieu. Tot i que aquest pas es centra en Python, si no voleu utilitzar Python, hauríeu de llegir aquesta part ja que conté alguns consells i trucs.

El paquet xml s'inclou per defecte amb la majoria de distribucions estàndard de Python. Utilitzarem aquest paquet per analitzar molt fàcilment el nostre fitxer OSM tal com es mostra a la primera imatge. En un sol bucle for, podeu processar la gestió de dades OSM per a cada element de dades concret.

A la línia final de la imatge, notareu que he comprovat si hi ha l'etiqueta "límits". Aquest pas és de vital importància per traduir els valors de latitud i longitud a píxels a la pantalla. Us recomano executar aquesta conversió en el moment de carregar el fitxer OSM, ja que la conversió massiva de dades és molt intensa.

Parlant de convertir latituds i longituds en coordenades de pantalla, aquí teniu un enllaç a la funció de càlcul que vaig escriure. Probablement notareu alguna cosa una mica estrany en convertir latitud a coordenades de pantalla. Hi ha un pas addicional en comparació amb la longitud! Resulta que les dades OSM es modelen mitjançant el mètode de projecció Pseudo-Mercator. Afortunadament, OSM té aquí una fantàstica documentació sobre aquest tema i proporciona les funcions de conversió de latitud per a un nombre important d’idiomes. Increïble!

Nota: al meu codi, la coordenada de la pantalla (0, 0) és l'extrem superior esquerre de la pantalla.

Pas 4: Implementació de Python Map Stylizer

Fins aquí, he parlat del fitxer de dades OSM: què és, com llegir-lo i què fer-ne. Ara parlaré del programari que vaig escriure per afrontar la visualització de mapes estilístics (repositori de GitHub proporcionat a la introducció).

La meva implementació específica se centra en el control de l'usuari de la canonada de representació. Concretament, permeto a l'usuari seleccionar les capes que volen veure i com vol que es visualitzi aquesta capa. Com he esmentat breument anteriorment, hi ha dues classes d'elements representats: elements d'emplenament i línies de comanda. Els emplenaments només es defineixen per un color, mentre que les línies es defineixen per color, amplada de línia, estil de línia, estil de tapa de línia i estil de combinació de línia.

A mesura que l'usuari fa modificacions en els estils de capa i la visibilitat, els canvis es reflecteixen al giny del mapa a la dreta. Un cop un usuari hagi modificat l’aspecte del mapa per a la seva satisfacció, pot ajustar la dimensió màxima del mapa i desar-lo com a imatge al seu ordinador. En desar una imatge, també es desarà un fitxer de configuració de l'usuari. Això garanteix que un usuari pugui recordar i reutilitzar la configuració que va utilitzar per generar una imatge concreta en qualsevol moment.

Pas 5: Implementació de desavantatges + solució

Quan vaig començar a estilitzar un mapa manualment, vaig saber que era un procés bastant tediós. Oferir a l'usuari el màxim control pot ser simplement aclaparador a causa del gran nombre de "comandaments" disponibles. No obstant això, hi ha una solució senzilla, que implica una mica de seqüència de comandes addicional.

Vaig començar identificant quines capes m'interessen particularment. Amb aquest propòsit instructiu, diguem que estic més interessat en edificis (tots), rius, carreteres principals i carrers superficials. Escriuria un script on creeu una instància de configuració, canvieu els estats de capa adequadament utilitzant la funció setItemState () i les constants definides, i establiria els colors segons com voldria que apareguessin les meves capes mitjançant el setValue (). El fitxer de configuració resultant que es desa es pot copiar a la carpeta configs i carregar-lo per l'usuari.

Un exemple de guió es troba a la imatge superior. La segona imatge és una mostra de com serien les funcions d’ajuda i, com que bàsicament són totes idèntiques, només amb constants variables, només he inclòs una imatge d’un exemple.

Pas 6: Àrees de millora

Després de reflexionar sobre la meva implementació de programari, he identificat diverses àrees que serien útils per als usuaris avançats.

1. Representació dinàmica de la capa. Actualment, tinc una llista predefinida de capes que es renderitzaran, ja està. Part de la justificació era la dificultat per determinar si una capa havia de ser una línia o un farciment. Com a resultat, amb gairebé tots els fitxers OSM que obriu, rebrà una sèrie d'advertències sobre capes que no es renderitzaran. Sovint són tan mínims que no és un problema, però és probable que falten capes crítiques. La representació dinàmica de la capa eliminaria aquestes preocupacions.
2. Assignació de capes dinàmiques. Això va de la mà del # 1; si voleu la representació dinàmica de la capa, necessiteu una assignació dinàmica de la capa (és a dir, identificar una capa de farciment vs. una capa de línia). Això es podria aconseguir raonablement, com he après, perquè les formes que tenen el primer i l'últim node són el mateix seran camins tancats i, per tant, emplenats.
3. Grups de colors. Un mapa estilitzat sovint té diverses capes que tenen el mateix estil i permetre a l’usuari modificar l’estil d’un grup alhora alhora disminuiria considerablement el temps dedicat a l’edició de capes una per una.

Pas 7: Tancament dels pensaments

Gràcies a tothom per dedicar-vos el temps a llegir el meu Instructable. Aquest projecte representa la culminació de moltes hores de recerca, disseny, programació i depuració. Espero haver estat capaç de proporcionar una plataforma de llançament a partir de la qual pugueu construir el vostre propi projecte o aprofitar el que ja he escrit. També espero que les meves mancances i consells aportin molts punts a tenir en compte en el vostre disseny. Si esteu menys inclinat a programar i més inclinat a crear obres d’art, m’encantaria veure què feu als comentaris. Les possibilitats són infinites!

Un agraïment especial als col·laboradors d'OpenStreetMap. Projectes com aquest no serien possibles sense els seus esforços significatius.

Feu-m’ho saber si teniu cap pregunta als comentaris.

Segon classificat del Maps Challenge