Sadržaj:

Kako stvoriti prilagođene stilizirane karte pomoću OpenStreetMap -a: 7 koraka (sa slikama)
Kako stvoriti prilagođene stilizirane karte pomoću OpenStreetMap -a: 7 koraka (sa slikama)

Video: Kako stvoriti prilagođene stilizirane karte pomoću OpenStreetMap -a: 7 koraka (sa slikama)

Video: Kako stvoriti prilagođene stilizirane karte pomoću OpenStreetMap -a: 7 koraka (sa slikama)
Video: Полный курс по Next js - Изучи Nextjs за 2 часа! | React SSR +таймкоды 2024, Juli
Anonim
Kako stvoriti prilagođene stilizirane karte pomoću OpenStreetMap -a
Kako stvoriti prilagođene stilizirane karte pomoću OpenStreetMap -a

U ovom uputstvu opisat ću proces pomoću kojeg možete generirati vlastite prilagođene stilizirane karte. Stilizirana karta je mapa na kojoj korisnik može odrediti koji se slojevi podataka vizualiziraju, kao i definirati stil kojim se svaki sloj vizualizira. Prvo ću opisati postupak kroz koji možete pisati softver za stiliziranje karata, a zatim slijedi primjer softvera Python koji sam napisao za izvršavanje ovog zadatka.

Sljedeći video prikazuje kako ja osobno generiram stilizirane karte, ali nastavite čitati radi intimnih detalja. Veoma sam uzbuđen što vidim šta zajednica stvara!

Šta je moja motivacija iza ovog projekta?

Iskreno, započeo sam ovaj projekt jer sam mislio da će to biti zabavno. Ova ideja mi se vrzmala po glavi posljednjih godinu dana i konačno sam odvojio vrijeme koje mi je bilo potrebno da je ostvarim. Nakon dana prototipiranja s nekim osnovnim skriptama, uspio sam generirati izuzetno obećavajuće rezultate - toliko obećavajuće da sam znao da moram formalizirati svoje skripte tako da drugi lako mogu stvarati vlastite kreacije.

Moja motivacija za pisanje ovog uputstva je činjenica da sam pronašao vrlo minimalne informacije o tome kako stvoriti vlastite stilizirane karte od nule. Nadam se da ću naučeno podijeliti sa zajednicom.

Resursi/Linkovi:

  • OpenStreetMap
  • OpenStreetMap Legalese
  • Github spremište

Supplies

  • Python distribucija (koristio sam Anacondu i Python 3.6)
  • PyQt5 (za GUI zavisnosti)

Korak 1: Definiranje procesa I: Preuzimanje OSM datoteke

Definiranje procesa I: Preuzimanje OSM datoteke
Definiranje procesa I: Preuzimanje OSM datoteke

Kad sam tek započeo ovaj projekt, najočitije pitanje bilo je "gdje mogu dobiti podatke s karte". Naravno, kao što ste očekivali, odmah sam pomislio na Google Maps. Nakon značajnog istraživanja, otkrio sam da Google zaista ne želi da se ljudi igraju s njihovim podacima, u kreativnom smislu ili na neki drugi način. Zapravo, izričito zabranjuju struganje weba s Google karata.

Srećom, moj očaj je kratko trajao nakon što sam otkrio OpenStreetMap (OSM). OSM je zajednički projekat koji uključuje ljude iz cijelog svijeta koji dostavljaju podatke. OSM izričito dozvoljava otvorenu upotrebu njihovih podataka u ime softvera otvorenog koda. Kao takvo, posjećivanje OSM web stranice započinje putovanje sa stilizacijom karte.

Nakon dolaska na web stranicu OSM -a, kliknite na karticu "Izvoz" za prikaz alata za izvoz karata. Sada uvećajte prikaz da biste vidjeli regiju za koju ste zainteresirani za prikupljanje kartografskih podataka. Odaberite vezu "Ručno odaberite drugo područje" koja će otvoriti okvir na vašem ekranu. Oblikujte i postavite ovu kutiju iznad područja interesa. Nakon što ste zadovoljni, kliknite gumb "Izvezi" da biste preuzeli OSM datoteku s podacima.

Napomena #1: Ako odabrana regija sadrži previše podataka, dobit ćete grešku da ste odabrali previše čvorova. Ako vam se to dogodi, kliknite gumb "Overpass API" za preuzimanje veće datoteke.

Napomena #2: Ako je vaša preuzeta OSM datoteka veća od 30 MB, Python program koji sam napisao primjetno će se usporiti. Ako ste odlučni koristiti veliku regiju, razmislite o pisanju skripte za bacanje suvišnih podataka koje ne planirate crtati.

Korak 2: Definisanje procesa II: Razumevanje podataka

Definisanje procesa II: Razumevanje podataka
Definisanje procesa II: Razumevanje podataka
Definisanje procesa II: Razumevanje podataka
Definisanje procesa II: Razumevanje podataka
Definisanje procesa II: Razumevanje podataka
Definisanje procesa II: Razumevanje podataka
Definisanje procesa II: Razumevanje podataka
Definisanje procesa II: Razumevanje podataka

"Imam podatke … šta sad?"

Počnite otvaranjem preuzete OSM datoteke u svom omiljenom softveru za uređivanje teksta. Prvo ćete primijetiti da je ovo XML datoteka, što je odlično! XML je dovoljno lako raščlaniti. Početak vaše datoteke trebao bi izgledati gotovo identično prvoj slici ovog koraka - bit će navedeni neki osnovni metapodaci i geografske granice.

Dok pomičete datoteku, primijetit ćete tri elementa podataka koji se koriste u cijelom:

  1. Čvorovi
  2. Načini
  3. Odnosi

Najosnovniji element podataka, čvor jednostavno ima jedinstveni identifikator, zemljopisnu širinu i dužinu koji su povezani s njim. Naravno, postoje dodatni metapodaci, ali ih možemo sigurno odbaciti.

Načini su zbirke čvorova. Način se može prikazati kao zatvoreni oblik ili kao otvorena linija. Načini se sastoje od zbirke čvorova identificiranih njihovim jedinstvenim identifikatorom. Označeni su ključevima koji definiraju grupu podataka kojoj pripadaju. Na primjer, način prikazan na trećoj gornjoj slici pripada grupi podataka "mjesto" i njegovoj podgrupi "ostrvo". Drugim riječima, ovaj određeni način pripada sloju "otoka" u grupi "mjesto". Načini takođe imaju jedinstvene identifikatore.

Na kraju, odnosi su skup načina. Relacija može predstavljati složeni oblik s rupama ili s više regija. Odnosi će također imati jedinstveni identifikator i bit će označeni slično načinima.

Više o ovim elementima podataka možete pročitati na OSM wiki:

  • Čvorovi
  • Načini
  • Odnosi

Korak 3: Definisanje procesa III: Sažimanje podataka

Definisanje procesa III: Sažimanje podataka
Definisanje procesa III: Sažimanje podataka

Sada biste trebali barem površno razumjeti elemente podataka koji čine OSM datoteku. U ovom smo trenutku zainteresirani za čitanje OSM podataka koristeći jezik koji odaberete. Iako je ovaj korak usmjeren na Python, ako ne želite koristiti Python, ipak biste trebali pročitati ovaj dio jer sadrži nekoliko savjeta i trikova.

Paket xml je standardno uključen u većinu standardnih Python distribucija. Ovaj paket ćemo koristiti za vrlo jednostavno raščlanjivanje naše OSM datoteke kako je prikazano na prvoj slici. U jednoj for petlji možete obraditi rukovanje OSM podacima za svaki određeni element podataka.

Na posljednjoj liniji slike primijetit ćete da provjeravam oznaku 'bounds'. Ovaj korak je od vitalnog značaja za prevođenje vrijednosti zemljopisne širine i dužine u piksele na ekranu. Toplo preporučujem pokretanje ove konverzije u vrijeme učitavanja OSM datoteke jer je masovna konverzija podataka intenzivna u procesu.

Govoreći o pretvaranju zemljopisnih širina i dužina u koordinate ekrana, evo veze do računske funkcije koju sam napisao. Vjerojatno ćete primijetiti nešto malo čudno u pretvaranju zemljopisne širine u koordinate ekrana. Postoji dodatni korak u odnosu na geografsku dužinu! Kako se ispostavilo, OSM podaci modelirani su pomoću Pseudo-Mercator projekcije. Srećom, OSM ovdje ima fantastičnu dokumentaciju o ovoj temi i pruža funkcije konverzije zemljopisne širine za značajan broj jezika. Awesome!

Napomena: U mom kodu, koordinata ekrana (0, 0) je gornji lijevi ugao ekrana.

Korak 4: Implementacija Python Map Stylizer -a

Implementacija Python Map Stylizer -a
Implementacija Python Map Stylizer -a
Implementacija Python Map Stylizer -a
Implementacija Python Map Stylizer -a
Implementacija Python Map Stylizer -a
Implementacija Python Map Stylizer -a

Do ovog trenutka raspravljao sam o OSM datoteci s podacima - što je to, kako je čitati i što s njom učiniti. Sada ću raspravljati o softveru koji sam napisao za rješavanje stilske vizualizacije karte (GitHub repo naveden u uvodu).

Moja specifična implementacija fokusira se na korisničku kontrolu renderovanja. Konkretno, dopuštam korisniku da odabere slojeve koje želi vidjeti i kako želi da se taj sloj vizualizira. Kao što sam ukratko spomenuo ranije, postoje dvije klase prikazanih elemenata: stavke popune i stavke retka. Ispune su definirane samo bojom, dok su linije definirane bojom, širinom linije, stilom linije, stilom kapice linije i stilom spajanja linija.

Kako korisnik vrši izmjene stilova slojeva i vidljivosti, promjene se odražavaju u widgetu karte s desne strane. Nakon što je korisnik izmijenio izgled karte na svoje zadovoljstvo, može prilagoditi maksimalnu dimenziju karte i spremiti kartu kao sliku na svom računaru. Prilikom spremanja slike bit će spremljena i korisnička konfiguracijska datoteka. Ovo osigurava da se korisnik u bilo kojem trenutku može prisjetiti i ponovno koristiti konfiguraciju koju je koristio za generiranje određene slike.

Korak 5: Zastoj implementacije + Rješenje

Nedostaci implementacije + rješenje
Nedostaci implementacije + rješenje
Nedostaci implementacije + rješenje
Nedostaci implementacije + rješenje

Kad sam prvi put počeo ručno stilizirati kartu, naučio sam da je to prilično dosadan proces. Nuđenje maksimalne kontrole korisniku može biti jednostavno neodoljivo zbog velikog broja dostupnih "gumba". Međutim, postoji jednostavno rješenje, koje uključuje malo dodatnog skriptiranja.

Počeo sam identificiranjem slojeva koji me posebno zanimaju. U svrhu ovog uputstva, recimo da me najviše zanimaju zgrade (sve one), rijeke, glavni autoputevi i površinske ulice. Napisao bih skriptu gdje kreiram instancu konfiguracije, na odgovarajući način mijenjam stanja slojeva koristeći funkciju setItemState () i definirane konstante, te postavljam boje na osnovu načina na koji bih želio da se moji slojevi pojavljuju koristeći setValue (). Dobivena konfiguracijska datoteka koja se sprema može se kopirati u mapu configs i učitati od strane korisnika.

Primjer skripte je na gornjoj slici. Druga slika je primjer kako bi pomoćne funkcije izgledale, a budući da su u osnovi sve identične, samo s različitim konstantama, uključio sam samo sliku jednog primjera.

Korak 6: Područja za poboljšanje

Područja za poboljšanje
Područja za poboljšanje

Nakon razmišljanja o implementaciji softvera, identificirao sam nekoliko područja koja bi bila korisna poboljšanja za napredne korisnike.

  1. Dinamičko renderiranje slojeva. Trenutno imam unaprijed definiranu listu slojeva koji će se iscrtati, to je to. Dio opravdanja bile su poteškoće u određivanju da li sloj treba biti linija ili ispuna. Kao rezultat toga, sa gotovo svakom OSM datotekom koju otvorite, dočekat ćete mnoštvo upozorenja o slojevima koji se neće prikazati. Često su tako minimalni da to nije problem, ali mora postojati da nedostaju kritični slojevi. Dinamičko iscrtavanje sloja otklonilo bi ove nedoumice.
  2. Dinamičko dodjeljivanje sloja. Ovo ide ruku pod ruku s #1; ako želite dinamičko iscrtavanje sloja, trebate dodjelu dinamičkog sloja (tj. identificiranje sloja ispune u odnosu na linijski sloj). To bi se razumno moglo postići, kako sam naučio, jer će načini čiji su prvi i posljednji čvor isti biti zatvorene staze i stoga popunjeni.
  3. Grupe boja. Stilizirana mapa često ima nekoliko slojeva koji imaju isti stil, a omogućavanje korisniku da promijeni stil grupe u isto vrijeme uvelike bi smanjilo korisnikovo vrijeme utrošeno na uređivanje slojeva jedan po jedan.

Korak 7: Zatvaranje misli

Završne misli
Završne misli
Završne misli
Završne misli
Završne misli
Završne misli

Hvala svima što ste odvojili vrijeme da pročitate moj Instructable. Ovaj projekt predstavlja vrhunac višesatnog istraživanja, dizajna, programiranja i otklanjanja grešaka. Nadam se da sam uspio pružiti lansirnu ploču s koje možete izgraditi vlastiti projekt ili nadograditi ono što sam već napisao. Nadam se i da će moji nedostaci i savjeti pružiti mnogo tačaka za razmatranje pri vašem dizajnu. Ako ste manje skloni programiranju, a više stvaranju umjetničkih djela, volio bih vidjeti šta radite u komentarima! Mogućnosti su beskrajne!

Posebno hvala saradnicima OpenStreetMap -a! Ovakvi projekti ne bi bili mogući bez njihovih značajnih napora.

Javite mi ako imate pitanja u komentarima!

Maps Challenge
Maps Challenge
Maps Challenge
Maps Challenge

Drugoplasirani u izazovu Maps

Preporučuje se: