Innehållsförteckning:

Hur man skapar anpassade stiliserade kartor med OpenStreetMap: 7 steg (med bilder)
Hur man skapar anpassade stiliserade kartor med OpenStreetMap: 7 steg (med bilder)

Video: Hur man skapar anpassade stiliserade kartor med OpenStreetMap: 7 steg (med bilder)

Video: Hur man skapar anpassade stiliserade kartor med OpenStreetMap: 7 steg (med bilder)
Video: Полный курс по Next js - Изучи Nextjs за 2 часа! | React SSR +таймкоды 2024, Juli
Anonim
Hur man skapar anpassade stiliserade kartor med OpenStreetMap
Hur man skapar anpassade stiliserade kartor med OpenStreetMap

I denna instruerbara beskrivning kommer jag att beskriva en process genom vilken du kan skapa dina egna skräddarsydda stiliserade kartor. En stiliserad karta är en karta där användaren kan ange vilka datalager som visualiseras, samt definiera den stil som varje lager visualiseras med. Jag kommer först att beskriva processen genom vilken du kan skriva programvara för att stilisera kartor, följt av ett exempel på Python -programvaran jag skrev för att utföra denna uppgift.

Följande video belyser hur jag personligen genererar stiliserade kartor, men fortsätter läsa för de intima detaljerna. Jag är väldigt spänd på att se vad samhället skapar!

Vad är min motivation bakom det här projektet?

Ärligt talat startade jag det här projektet eftersom jag tyckte att det skulle vara kul att göra. Den här idén har skramlat runt i mina tankar det senaste året, och jag tog äntligen den tid jag behövde för att förverkliga den. Efter en dag med prototyper med lite grundläggande skript kunde jag generera extremt lovande resultat - så lovande att jag visste att jag behövde formalisera mina skript så att andra enkelt kunde skapa egna skapelser.

Min motivation att skriva detta instruerbara beror på det faktum att jag hittade mycket minimal information om hur du skapar dina egna stiliserade kartor från grunden. Jag hoppas kunna dela det jag lärt mig med samhället.

Resurser/länkar:

  • OpenStreetMap
  • OpenStreetMap Legalese
  • Github -förvar

Tillbehör

  • En Python -distribution (jag använde Anaconda & Python 3.6)
  • PyQt5 (för GUI -beroenden)

Steg 1: Definiera processen I: Ladda ner OSM -filen

Definiera processen I: Ladda ner OSM -filen
Definiera processen I: Ladda ner OSM -filen

När jag först började detta projekt var den mest uppenbara frågan "var kan jag få kartdata." Naturligtvis, som du förväntar dig, tänkte jag omedelbart på Google Maps. Efter omfattande forskning upptäckte jag att Google verkligen inte vill att folk ska leka med sina data, i kreativ mening eller på annat sätt. I själva verket tillåter de uttryckligen webbskrapning från Google Maps.

Lyckligtvis var min förtvivlan kort när jag upptäckte OpenStreetMap (OSM). OSM är ett samarbetsprojekt där människor över hela världen bidrar med data. OSM tillåter uttryckligen öppen användning av deras data i namnet på programvara med öppen källkod. Som sådan, besöker OSM -webbsidan är där kartstyliseringsresan börjar.

När du har kommit till OSM -webbplatsen klickar du på fliken "Exportera" för att visa kartexportverktygen. Zooma nu in för att se den region som du är intresserad av att samla in kartdata. Välj länken "Manuellt välja ett annat område", vilket kommer att visa en ruta på skärmen. Forma och placera denna låda över intresseområdet. När du är nöjd klickar du på knappen "Exportera" för att ladda ner din OSM -datafil.

Obs #1: Om din valda region innehåller för mycket data får du ett felmeddelande om att du har valt för många noder. Om detta händer dig klickar du på knappen "Överpass API" för att ladda ner din större fil.

Obs #2: Om din nedladdade OSM -fil är större än 30 MB, kommer Python -programmet som jag skrev märkbart långsamt. Om du är fast besluten att använda en stor region, överväg att skriva ett manus för att slänga överflödiga data som du inte planerar att rita.

Steg 2: Definiera processen II: Förstå data

Definiera process II: Förstå data
Definiera process II: Förstå data
Definiera process II: Förstå data
Definiera process II: Förstå data
Definiera process II: Förstå data
Definiera process II: Förstå data
Definiera process II: Förstå data
Definiera process II: Förstå data

"Jag har data … nu vad?"

Börja med att öppna din nedladdade OSM -fil i ditt favoritprogram för textredigering. Du kommer först att märka att detta är en XML -fil, vilket är bra! XML är lätt nog att analysera. Början av din fil ska se nästan identisk ut med den första bilden i detta steg - några grundläggande metadata och geografiska gränser kommer att listas.

När du bläddrar i filen kommer du att märka tre dataelement som används hela tiden:

  1. Knutpunkter
  2. Sätt
  3. Förhållanden

Det mest grundläggande dataelementet, en nod har helt enkelt en unik identifierare, latitud och longitud associerad med den. Naturligtvis finns det ytterligare metadata, men vi kan säkert kasta dem.

Sätt är samlingar av noder. Ett sätt kan återges som en sluten form eller som en öppen linje. Sätt består av en samling noder som identifieras med deras unika identifierare. De är märkta med nycklar som definierar datagruppen de tillhör. Till exempel tillhör det sätt som visas i den tredje bilden ovan datagruppen "plats" och dess undergrupp "ö". Med andra ord tillhör detta speciella sätt "ö" -skiktet under "plats" -gruppen. Sätt har också unika identifierare.

Slutligen är relationer samlingar av sätt. En relation kan representera en komplex form med hål eller med flera regioner. Relationer kommer också att ha en unik identifierare och kommer att märkas på liknande sätt.

Du kan läsa mer om dessa dataelement från OSM -wikin:

  • Knutpunkter
  • Sätt
  • Förhållanden

Steg 3: Definiera process III: smälta data

Definiera process III: smälta data
Definiera process III: smälta data

Nu bör du ha åtminstone en ytlig förståelse av dataelementen som utgör en OSM -fil. För närvarande är vi intresserade av att läsa OSM -data med ditt valda språk. Även om detta steg är Python-centriskt, om du inte vill använda Python, bör du fortfarande läsa den här delen eftersom den innehåller några tips och tricks.

XML -paketet ingår som standard med de flesta vanliga Python -distributioner. Vi kommer att använda detta paket för att enkelt analysera vår OSM -fil som visas i den första bilden. I en enda för loop kan du bearbeta hanteringen av OSM -data för varje visst dataelement.

På den sista raden i bilden kommer du att märka att jag letar efter taggen "gränser". Detta steg är mycket viktigt för att översätta latitud- och longitudvärdena till pixlar på skärmen. Jag rekommenderar starkt att du kör den här konverteringen när du läser in OSM -filen, eftersom massomvandlingen av data är processintensiv.

På tal om att konvertera breddgrader och longitud till skärmkoordinater, här är en länk till beräkningsfunktionen jag skrev. Du kommer troligen att märka något lite konstigt när du konverterar latitud till skärmkoordinater. Det är ett extra steg inblandat jämfört med longitud! Som det visar sig modelleras OSM-data med hjälp av Pseudo-Mercator-projektionsmetoden. Lyckligtvis har OSM fantastisk dokumentation om detta ämne här, och de tillhandahåller latitudomvandlingsfunktioner för ett betydande antal språk. Grymt bra!

Obs! I min kod är skärmkoordinat (0, 0) det övre vänstra hörnet på skärmen.

Steg 4: Implementering av Python Map Stylizer

Implementering av Python Map Stylizer
Implementering av Python Map Stylizer
Implementering av Python Map Stylizer
Implementering av Python Map Stylizer
Implementering av Python Map Stylizer
Implementering av Python Map Stylizer

Fram till denna tidpunkt har jag diskuterat OSM -datafilen - vad det är, hur man läser det och vad jag ska göra med det. Nu kommer jag att diskutera programvaran jag skrev för att ta itu med stilistisk kartvisualisering (GitHub -repo finns i inledningen).

Min specifika implementering fokuserar på användarkontroll av rendering pipeline. Specifikt tillåter jag användaren att välja de lager de vill ha synliga och hur de vill att det lagret ska visualiseras. Som jag kort nämnde tidigare finns det två klasser av element som återges: fyllningsobjekt och rader. Fyllningar definieras endast av en färg, medan linjer definieras av färg, linjebredd, linjestil, linjekapsstil och radanslutningsstil.

När användaren gör ändringar i lagerstilar och synlighet återspeglas ändringarna i kartwidgeten till höger. När en användare har ändrat kartans utseende till sin tillfredsställelse kan han justera den maximala kartdimensionen och spara kartan som en bild på sin dator. När du sparar en bild sparas också en användarkonfigurationsfil. Detta säkerställer att en användare kan återkalla och återanvända konfigurationen han använde för att generera en viss bild när som helst.

Steg 5: Implementeringsnackdel + lösning

Implementering Nackdel + lösning
Implementering Nackdel + lösning
Implementering Nackdel + lösning
Implementering Nackdel + lösning

När jag började stylisera en karta manuellt förstod jag att detta var en ganska tråkig process. Att erbjuda användaren maximal kontroll kan vara helt enkelt överväldigande på grund av det stora antalet tillgängliga "rattar". Det finns dock en enkel lösning, som innebär lite extra skript.

Jag började med att identifiera vilka lager jag är särskilt intresserad av. För detta instruerbara, låt oss säga att jag är mest intresserad av byggnader (alla), floder, huvudvägar och ytgator. Jag skulle skriva ett skript där jag skapar en instans av konfiguration, växlar lagerstater på lämpligt sätt med funktionen setItemState () och definierade konstanter och anger färger baserat på hur jag skulle vilja att mina lager ska visas med setValue (). Den resulterande konfigurationsfilen som sparas kan kopieras till configs -mappen och laddas av användaren.

Ett exempelskript finns i bilden ovan. Den andra bilden är ett exempel på hur hjälpfunktionerna skulle se ut, och eftersom de i princip alla är identiska, bara med olika konstanter, inkluderade jag bara en bild av ett exempel.

Steg 6: Områden för förbättring

Områden för förbättring
Områden för förbättring

Efter att ha reflekterat över min programvaruimplementering har jag identifierat flera områden som skulle vara användbara förbättringar för kraftanvändare.

  1. Dynamisk lageråtergivning. För närvarande har jag en fördefinierad lista över lager som kommer att återges, det är det. En del av motiveringen var svårigheten att avgöra om ett lager ska vara en linje eller en fyllning. Som ett resultat kommer du att hälsas med en rad varningar om lager som inte återges med nästan varje OSM -fil du öppnar. Ofta är dessa så minimala att det inte är ett problem, men det kommer säkert att saknas kritiska lager. Dynamisk lageråtergivning skulle eliminera dessa problem.
  2. Dynamisk lagertilldelning. Detta går hand i hand med #1; om du vill ha dynamisk lageråtergivning behöver du dynamisk lagertilldelning (dvs. identifiera ett fyllnadsskikt kontra ett radskikt). Detta kan rimligen uppnås, som jag har lärt mig, eftersom sätt vars första och sista nod är desamma kommer att vara slutna vägar och därför fyllas.
  3. Färggrupper. En stiliserad karta har ofta flera lager som har samma stil, och att göra det möjligt för användaren att ändra en grupps stil samtidigt skulle betydligt minska användarens tid att redigera lager en efter en.

Steg 7: Avslutande tankar

Avslutande tankar
Avslutande tankar
Avslutande tankar
Avslutande tankar
Avslutande tankar
Avslutande tankar

Tack alla för att ni tog er tid att läsa igenom min instruktionsbok. Detta projekt representerar kulmen på många timmars forskning, design, programmering och felsökning. Jag hoppas att jag har kunnat tillhandahålla en startplatta från vilken du kan bygga ditt eget projekt eller bygga vidare på det jag redan har skrivit. Jag hoppas också att mina brister och tips ger många punkter att tänka på i din design. Om du är mindre benägen att programmera och mer benägen att skapa konstverk, skulle jag gärna se vad du gör i kommentarerna! Möjligheterna är oändliga!

Ett särskilt tack till OpenStreetMap -bidragsgivarna! Projekt som detta skulle inte vara möjliga utan deras betydande insatser.

Meddela mig om du har några frågor i kommentarerna!

Maps Challenge
Maps Challenge
Maps Challenge
Maps Challenge

Tvåa i Maps Challenge

Rekommenderad: