Inhaltsverzeichnis:

So erstellen Sie benutzerdefinierte stilisierte Karten mit OpenStreetMap - Gunook
So erstellen Sie benutzerdefinierte stilisierte Karten mit OpenStreetMap - Gunook

Video: So erstellen Sie benutzerdefinierte stilisierte Karten mit OpenStreetMap - Gunook

Video: So erstellen Sie benutzerdefinierte stilisierte Karten mit OpenStreetMap - Gunook
Video: OSM Tutorial - der iD-Editor 2024, Juli
Anonim
So erstellen Sie benutzerdefinierte stilisierte Karten mit OpenStreetMap
So erstellen Sie benutzerdefinierte stilisierte Karten mit OpenStreetMap

In diesem anweisbaren beschreibe ich einen Prozess, mit dem Sie Ihre eigenen maßgeschneiderten stilisierten Karten generieren können. Eine stilisierte Karte ist eine Karte, bei der der Benutzer angeben kann, welche Datenlayer visualisiert werden, sowie den Stil definieren, mit dem jeder Layer visualisiert wird. Ich werde zuerst den Prozess beschreiben, durch den Sie Software zum Stilisieren von Karten schreiben können, gefolgt von einem Beispiel für die Python-Software, die ich geschrieben habe, um diese Aufgabe auszuführen.

Das folgende Video zeigt, wie ich persönlich stilisierte Karten erstelle, aber lesen Sie weiter, um die intimen Details zu erfahren. Ich bin sehr gespannt, was die Community schafft!

Was ist meine Motivation hinter diesem Projekt?

Ehrlich gesagt habe ich dieses Projekt gestartet, weil ich dachte, es würde Spaß machen. Diese Idee schwirrte mir seit einem Jahr im Kopf herum und ich nahm mir endlich die Zeit, die ich brauchte, um sie in die Tat umzusetzen. Nach einem Tag Prototyping mit einigen grundlegenden Skripten konnte ich äußerst vielversprechende Ergebnisse erzielen – so vielversprechend, dass ich wusste, dass ich meine Skripte so formalisieren musste, dass andere problemlos eigene Kreationen erstellen konnten.

Meine Motivation, dieses instructable zu schreiben, ist auf die Tatsache zurückzuführen, dass ich sehr minimale Informationen darüber gefunden habe, wie Sie Ihre eigenen stilisierten Karten von Grund auf neu erstellen. Ich hoffe, das Gelernte mit der Community teilen zu können.

Ressourcen/Links:

  • OpenStreetMap
  • OpenStreetMap Legalese
  • Github-Repository

Lieferungen

  • Eine Python-Distribution (ich habe Anaconda & Python 3.6)
  • PyQt5 (für die GUI-Abhängigkeiten)

Schritt 1: Definieren des Prozesses I: Herunterladen der OSM-Datei

Definieren des Prozesses I: Herunterladen der OSM-Datei
Definieren des Prozesses I: Herunterladen der OSM-Datei

Als ich dieses Projekt zum ersten Mal begann, war die krasseste Frage: "Woher bekomme ich Kartendaten?" Natürlich dachte ich erwartungsgemäß sofort an Google Maps. Nach umfangreichen Recherchen habe ich festgestellt, dass Google wirklich nicht möchte, dass die Leute mit ihren Daten spielen, im kreativen Sinne oder auf andere Weise. Tatsächlich verbieten sie das Web-Scraping von Google Maps ausdrücklich.

Glücklicherweise war meine Verzweiflung nur von kurzer Dauer, als ich OpenStreetMap (OSM) entdeckte. OSM ist ein Gemeinschaftsprojekt, an dem Menschen auf der ganzen Welt beteiligt sind, die Daten beisteuern. OSM erlaubt ausdrücklich die unbefristete Nutzung ihrer Daten im Namen von Open Source Software. Mit dem Besuch der OSM-Webseite beginnt die Reise zur Kartengestaltung.

Nachdem Sie die OSM-Website erreicht haben, klicken Sie auf die Registerkarte "Export", um die Kartenexport-Tools anzuzeigen. Zoomen Sie nun heran, um die Region anzuzeigen, mit der Sie Kartendaten sammeln möchten. Wählen Sie den Link "Manuell einen anderen Bereich auswählen", wodurch ein Feld auf Ihrem Bildschirm angezeigt wird. Forme dieses Kästchen und platziere es über dem interessierenden Bereich. Wenn Sie zufrieden sind, klicken Sie auf die Schaltfläche "Exportieren", um Ihre OSM-Datendatei herunterzuladen.

Hinweis #1: Wenn Ihre ausgewählte Region zu viele Daten enthält, erhalten Sie eine Fehlermeldung, dass Sie zu viele Knoten ausgewählt haben. Wenn Ihnen dies passiert, klicken Sie auf die Schaltfläche "Overpass API", um Ihre größere Datei herunterzuladen.

Hinweis #2: Wenn Ihre heruntergeladene OSM-Datei größer als 30 MB ist, wird das von mir geschriebene Python-Programm merklich langsamer. Wenn Sie eine große Region verwenden möchten, sollten Sie ein Skript schreiben, um überflüssige Daten zu verwerfen, die Sie nicht zeichnen möchten.

Schritt 2: Definieren des Prozesses II: Verstehen der Daten

Den Prozess definieren II: Die Daten verstehen
Den Prozess definieren II: Die Daten verstehen
Den Prozess definieren II: Die Daten verstehen
Den Prozess definieren II: Die Daten verstehen
Den Prozess definieren II: Die Daten verstehen
Den Prozess definieren II: Die Daten verstehen
Den Prozess definieren II: Die Daten verstehen
Den Prozess definieren II: Die Daten verstehen

„Ich habe die Daten… was nun?“

Beginnen Sie damit, Ihre heruntergeladene OSM-Datei in Ihrer bevorzugten Textbearbeitungssoftware zu öffnen. Sie werden zuerst feststellen, dass dies eine XML-Datei ist, was großartig ist! XML ist einfach genug zu parsen. Der Anfang Ihrer Datei sollte fast identisch mit dem ersten Bild dieses Schrittes aussehen - einige grundlegende Metadaten und geografische Grenzen werden aufgelistet.

Wenn Sie durch die Datei scrollen, werden Sie drei Datenelemente bemerken, die durchgehend verwendet werden:

  1. Knoten
  2. Wege
  3. Beziehungen

Das grundlegendste Datenelement, ein Knoten, hat einfach eine eindeutige Kennung, Breite und Länge, die ihm zugeordnet sind. Natürlich gibt es zusätzliche Metadaten, aber wir können sie bedenkenlos verwerfen.

Wege sind Ansammlungen von Knoten. Ein Weg kann als geschlossene Form oder als offene Linie gerendert werden. Wege bestehen aus einer Sammlung von Knoten, die durch ihre eindeutige Kennung identifiziert werden. Sie sind mit Schlüsseln versehen, die die Datengruppe definieren, zu der sie gehören. Der im dritten Bild oben dargestellte Weg gehört beispielsweise zur Datengruppe "Ort" und ihrer Untergruppe "Insel". Mit anderen Worten, dieser spezielle Weg gehört zum Layer "Insel" unter der Gruppe "Ort". Wege haben auch eindeutige Bezeichner.

Schließlich sind Relationen Ansammlungen von Wegen. Eine Relation kann eine komplexe Form mit Löchern oder mit mehreren Regionen darstellen. Beziehungen haben auch eine eindeutige Kennung und werden ähnlich wie Wege gekennzeichnet.

Weitere Informationen zu diesen Datenelementen finden Sie im OSM-Wiki:

  • Knoten
  • Wege
  • Beziehungen

Schritt 3: Definieren des Prozesses III: Verdauen der Daten

Definieren des Prozesses III: Verdauen der Daten
Definieren des Prozesses III: Verdauen der Daten

Jetzt sollten Sie zumindest ein oberflächliches Verständnis der Datenelemente haben, aus denen eine OSM-Datei besteht. An dieser Stelle sind wir daran interessiert, die OSM-Daten in der Sprache Ihrer Wahl zu lesen. Obwohl dieser Schritt Python-zentriert ist, sollten Sie diesen Teil dennoch lesen, wenn Sie Python nicht verwenden möchten, da er einige Tipps und Tricks enthält.

Das XML-Paket ist standardmäßig in den meisten Python-Standarddistributionen enthalten. Wir werden dieses Paket verwenden, um unsere OSM-Datei sehr einfach zu analysieren, wie im ersten Bild gezeigt. In einer einzigen for-Schleife können Sie die Behandlung von OSM-Daten für jedes einzelne Datenelement bearbeiten.

In der letzten Zeile des Bildes werden Sie feststellen, dass ich nach dem Tag "bounds" suche. Dieser Schritt ist von entscheidender Bedeutung, um die Breiten- und Längengrade in Pixel auf dem Bildschirm zu übersetzen. Ich empfehle dringend, diese Konvertierung zum Zeitpunkt des Ladens der OSM-Datei auszuführen, da die Massenkonvertierung von Daten prozessintensiv ist.

Apropos Konvertierung von Breiten- und Längengraden in Bildschirmkoordinaten, hier ist ein Link zu der Berechnungsfunktion, die ich geschrieben habe. Sie werden wahrscheinlich etwas Seltsames bemerken, wenn Sie den Breitengrad in Bildschirmkoordinaten umwandeln. Im Vergleich zum Längengrad ist ein zusätzlicher Schritt erforderlich! Wie sich herausstellt, werden OSM-Daten mit dem Pseudo-Mercator-Projektionsverfahren modelliert. Glücklicherweise hat OSM hier eine fantastische Dokumentation zu diesem Thema und bietet die Breitengrad-Konvertierungsfunktionen für eine beträchtliche Anzahl von Sprachen. Fantastisch!

Hinweis: In meinem Code ist die Bildschirmkoordinate (0, 0) die obere linke Ecke des Bildschirms.

Schritt 4: Python Map Stylizer-Implementierung

Implementierung des Python Map Stylizers
Implementierung des Python Map Stylizers
Implementierung des Python Map Stylizers
Implementierung des Python Map Stylizers
Implementierung des Python Map Stylizers
Implementierung des Python Map Stylizers

Bis zu diesem Punkt habe ich die OSM-Datendatei besprochen - was sie ist, wie man sie liest und was damit zu tun ist. Jetzt werde ich die Software diskutieren, die ich geschrieben habe, um die stilistische Kartenvisualisierung zu bewältigen (GitHub-Repository in der Einführung).

Meine spezifische Implementierung konzentriert sich auf die Benutzersteuerung der Rendering-Pipeline. Insbesondere erlaube ich dem Benutzer, die Ebenen auszuwählen, die sichtbar sein sollen, und wie diese Ebene visualisiert werden soll. Wie ich bereits kurz erwähnt habe, gibt es zwei Klassen von gerenderten Elementen: Füllelemente und Einzelelemente. Füllungen werden nur durch eine Farbe definiert, während Linien durch Farbe, Linienbreite, Linienstil, Linienabschlussstil und Linienverbindungsstil definiert werden.

Wenn der Benutzer Änderungen an Layer-Stilen und -Sichtbarkeit vornimmt, werden die Änderungen im Karten-Widget auf der rechten Seite widergespiegelt. Sobald ein Benutzer das Aussehen der Karte zu seiner Zufriedenheit geändert hat, kann er die maximale Kartendimension anpassen und die Karte als Bild auf seinem Computer speichern. Beim Speichern eines Bildes wird auch eine Benutzerkonfigurationsdatei gespeichert. Dies stellt sicher, dass ein Benutzer die Konfiguration, die er zum Generieren eines bestimmten Bildes verwendet hat, jederzeit abrufen und wiederverwenden kann.

Schritt 5: Implementierungsnachteil + Lösung

Implementierungsnachteil + Lösung
Implementierungsnachteil + Lösung
Implementierungsnachteil + Lösung
Implementierungsnachteil + Lösung

Als ich anfing, eine Karte manuell zu stilisieren, lernte ich, dass dies ein ziemlich mühsamer Prozess war. Dem Benutzer maximale Kontrolle zu bieten, kann aufgrund der großen Anzahl verfügbarer "Knöpfe" einfach überwältigend sein. Es gibt jedoch eine einfache Lösung, die ein wenig zusätzliches Skripting erfordert.

Ich begann damit, zu identifizieren, an welchen Schichten ich besonders interessiert bin. Zum Zweck dieses instructable, sagen wir, ich interessiere mich am meisten für Gebäude (alle), Flüsse, Hauptautobahnen und Straßen. Ich würde ein Skript schreiben, in dem ich eine Instanz von Configuration erstelle, Layer-Zustände mit der Funktion setItemState () und definierten Konstanten entsprechend umschalte und Farben basierend darauf setze, wie meine Layer mit setValue () angezeigt werden sollen. Die resultierende Konfigurationsdatei, die gespeichert wird, kann in den Ordner configs kopiert und vom Benutzer geladen werden.

Ein Beispielskript ist im Bild oben. Das zweite Bild ist ein Beispiel dafür, wie die Hilfsfunktionen aussehen würden, und da sie im Grunde alle identisch sind, nur mit unterschiedlichen Konstanten, habe ich nur ein Bild von einem Beispiel eingefügt.

Schritt 6: Bereiche für Verbesserungen

Verbesserungswürdige Bereiche
Verbesserungswürdige Bereiche

Nachdem ich über meine Softwareimplementierung nachgedacht hatte, habe ich mehrere Bereiche identifiziert, die für Power-User hilfreich wären.

  1. Dynamisches Layer-Rendering. Derzeit habe ich eine vordefinierte Liste von Ebenen, die gerendert werden, das war's. Ein Teil der Begründung war die Schwierigkeit zu bestimmen, ob eine Ebene eine Linie oder eine Füllung sein sollte. Als Ergebnis werden Sie bei fast jeder geöffneten OSM-Datei mit einer Reihe von Warnungen über Ebenen begrüßt, die nicht gerendert werden. Oft sind diese so minimal, dass es kein Problem darstellt, aber es fehlen zwangsläufig kritische Schichten. Dynamisches Layer-Rendering würde diese Bedenken beseitigen.
  2. Dynamische Layerzuordnung. Dies geht Hand in Hand mit #1; Wenn Sie dynamisches Layer-Rendering wünschen, benötigen Sie eine dynamische Layer-Zuweisung (d. h. das Identifizieren eines Füll-Layers im Vergleich zu einem Linien-Layer). Dies könnte, wie ich gelernt habe, vernünftigerweise erreicht werden, da Wege, deren erster und letzter Knoten gleich sind, eingeschlossene Wege sind und daher gefüllt werden.
  3. Farbgruppen. Eine stilisierte Karte weist häufig mehrere Layer mit demselben Stil auf. Wenn der Benutzer den Stil einer Gruppe gleichzeitig ändern könnte, würde dies die Zeit für die Bearbeitung von Layern nacheinander erheblich verringern.

Schritt 7: Gedanken zum Schluss

Schlussgedanken
Schlussgedanken
Schlussgedanken
Schlussgedanken
Schlussgedanken
Schlussgedanken

Vielen Dank an alle, die sich die Zeit genommen haben, mein Instructable durchzulesen. Dieses Projekt stellt den Höhepunkt vieler Stunden der Forschung, des Designs, der Programmierung und des Debuggens dar. Ich hoffe, ich konnte Ihnen eine Startrampe bieten, von der aus Sie Ihr eigenes Projekt erstellen oder auf dem aufbauen können, was ich bereits geschrieben habe. Ich hoffe auch, dass meine Mängel und Tipps viele Punkte liefern, die Sie bei Ihrem Design berücksichtigen sollten. Wenn Sie weniger dazu neigen, zu programmieren und mehr Kunstwerke zu schaffen, würde ich gerne sehen, was Sie in den Kommentaren machen! Die Möglichkeiten sind endlos!

Besonderer Dank geht an die OpenStreetMap-Mitwirkenden! Ohne ihren großen Einsatz wären solche Projekte nicht möglich.

Bei Fragen lass es mich gerne in den Kommentaren wissen!

Karten-Herausforderung
Karten-Herausforderung
Karten-Herausforderung
Karten-Herausforderung

Zweiter in der Karten-Herausforderung

Empfohlen: