Widok na www

Z UMP

Wersja z dnia 07:57, 29 gru 2008 (edytuj) Ludek (Dyskusja | wkład) (Od grudnia 2008 r. można oglądać mapę UMP-pcPL z poziomu www.) ← Poprzednia edycja		Wersja z dnia 20:39, 30 gru 2008 (edytuj) (anuluj zmianę) Mar rud (Dyskusja | wkład) (Pierwszy etap opisu głównych funkcjonalności mapy onlinie) Następna edycja →
Linia 1:		Linia 1:
	Od grudnia 2008 r. można oglądać mapę UMP-pcPL z poziomu www.		Od grudnia 2008 r. można oglądać mapę UMP-pcPL z poziomu www.
-	* http://mapa.ump.waw.pl/ump-www/iframe.html	+	Mapa występuje w kilku wersjach:
		+	* http://mapa.ump.waw.pl/ump-www/ - mapka z średnim okienku i opcją zaznaczania punktu
		+	* http://mapa.ump.waw.pl/ump-www/form.html - formularz wysyłania uwag do mapy
		+	* http://mapa.ump.waw.pl/ump-www/iframe.html - mapka samo-dopasowująca się do widocznego obszaru, którą można wykorzystać w iframe lub po prostu otworzyć, aby mieć mapę na pełne okno przeglądarki WWW.
		+
		+
		+	== Korzystanie z mapy ==
		+
		+	=== Nawigacja ===
		+	Podstawowym narzędziem nawigacyjnym jest myszka, którą można intuicyjnie przeciągać mapę. Mapa oferuje jednak więcej możliwości
		+	* myszka: przesuwanie, rolką przybliżenie lub oddalanie, podwójne kliknięcie centruje i przybliża
		+	* kontrolki nawigacyjne: przyciski na tle mapy ze strzałeczkami oraz +/- Dodatkowo pasek ZoomBar do bezpośredniego przeskoku na wskazane powiększenie (może być wyłączony).
		+	* klawiatura: strzałki oraz Home/End/Page Up/Page Down do przesuwania, +/- do zmiany powiększenia. Opcja może być wyłączona na niektórych mapach, lub przy wejściu w pole tekstowe formularza
		+
		+	=== Permalink ===
		+	W prawym dolnym rogu znajduje się link do aktualnego widoku mapy, który można dodać do zakładek lub przesłać znajomym. Link taki składa się z adresu bazowego strony oraz kilku parametrów, które można wykorzystać do budowania własnych linków:
		+	* lat, lon: położenie środka widocznej mapy
		+	* zoom: poziom powiększenia, gdzie 0 jest najniższy (jeden kafelek 256x256 zawiera cały świat)
		+	*layers: stan widocznych warstw i nakładek
		+	O ile lat,lon i zoom są zrozumiałe, to ostatni parametr może być lekko zagadkowy, więc najlepiej opisać na przykładzie:
		+
		+	http://mapa.ump.waw.pl/ump-www/?zoom=7&lat=52.33&lon=19.9&layers=B00T
		+
		+	Literki B/0 określają aktywność/nieaktywność warstw podstawowych. Z powyższego linku wynika że są 3 warstwy podstawowe, z których pierwsza jest ustawiona jako aktywna.
		+	Następnie występują literki T/F określające widoczność/ukrycie nakładek. W przykładzie jest tylko jedna nakładka wektorowa zawierająca warstwę wyświetlającą marker i jest ona aktywna (T)
		+
		+	=== Warstwy ===
		+	W prawym górnym rogu mapy znajduje się przycisk (+) pod którym pojawia się lista dostępnych warstw. UMP@Mapnik jest podstawową warstwą
		+	zawierającą mapę UMP-pcPL i jest wyświetlana jako domyślna. Dla porównania dostępna jest również warstwa z danymi z [http://www.openlayers.org/ OpenStreetMap]. Inne warstwy są w celach testowych i mogą zostać usunięte.
		+
		+	Poza warstwami mogą wystąpić dodatkowe nakładki wektorowe. Mogą to być zbiory punktów POI lub warstwy do rysowania wielokątów/linii/punktów. Aktualnie na mapie UMP-pcPL jest aktywna na stałe warstwa do rysowania markera. W przyszłości możliwe jest wzbogacenie o dodatkowe nakładki, które mogą być włączane lub wyłączane w menu warstw poprzez odpowiednie checkboxy.
		+
		+	=== Marker ===
		+	Dla celów formularza oraz możliwości generowania mapek wskazujących jakiś punkt, została utworzona wcześniej wspomniana warstwa dla markera.
		+
		+	O ile strona z mapą została prawidłowo przygotowana, kliknięcie na mapie powoduje dodanie markera w danym punkcie. Przy okazji mogą zostać wypełnione odpowiednie pola formularza współrzędnymi geograficznymi punktu.
		+
		+	Poza tworzeniem nowego punktu mapka umożliwia również linkowanie do wcześniej przygotowanego markera. Służą do tego dodatkowe parametry strony:
		+	* mlat, mlon: współrzędne punktu markera do wyświetlenia
		+	Przykładowy link zawierający definicję punktu do narysowania po otworzeniu strony:
		+
		+	http://mapa.ump.waw.pl/ump-www/?zoom=7&lat=52.33&lon=19.9&layers=B00T&mlat=52.25609&mlon=20.96567
		+
		+	=== Dodatkowe ozdobniki ===
		+	W pełnej wersji na mapie poza kontrolką nawigacyjną, przyciskiem warstw oraz permalinkiem znajdują się dodatkowe kontrolki. W lewym dolnym rogu znajduje się link do strony domowej UMP (Data by...) oraz status aktualności wyświetlanych danych mapowych.
		+	W prawym dolnym rogu kolejno od dołu widoczne są:
		+	* pozycja wskazywana przez kursor myszy
		+	* Permalink
		+	* orientacyjna skala aktualnego powiększenia
		+
		+
		+	== Mapa UMP-pcPL na Twojej stronie ==
		+
		+	Do wyświetlania mapy w przeglądarce WWW wykorzystana została biblioteka [http://www.openlayers.org/ OpenLayers],
		+	jednak można użyć dowolnej biblioteki tego rodzaju (np Google API). Kafelki mają odwzorowanie i numerację taką samą jak
		+	mapy Google czy [http://www.openlayers.org/ OSM] więc nie powinno być problemu z użyciem innych programów korzystających z tych źródeł.
		+
		+	Dla ułatwienia umieszczania mapki na stronach przygotowany został kod javascript, który powinien ułatwić wstępną konfigurację. Nic jednak nie przeszkadza, aby zrobić po swojemu, wykorzystując jedynie adresy kafelków. W przygotowanej wersji wystarczy jednak umieścić minimalną ilość dodatkowych elementów, by cieszyć się mapą na swojej stronie.
		+
		+	TODO...
		+	=== Wersja najprostsza ===
		+	<script>
		+	<div>
		+	<body>
		+
		+	=== Dodatkowe elementy mapy ===
		+	...
		+	* toolbox
		+	* pola tekstowe
		+	* permalink z markerem
		+
		+	=== Dostosowanie konfiguracji mapy ===
		+	...
		+
		+	=== Własna mapa od podstaw ===
		+	...
		+	==== OpenLayers ====
		+	...
		+	==== Google API ====
		+	...
		+
		+	== Szczegóły techniczne renderingu ==
		+
		+	=== Przygotowanie pliku importu *.osm.gz ===
		+	Mapa generowana jest na podstawie tych samych źródeł, z których powstają wersje na odbiorniki Garmin.
		+	Plik w formacie polskim (*.mp) jest wstępnie przygotowywany, a następnie konwertowany do pośredniego formatu xml zgodnego z [http://wiki.openstreetmap.org/wiki/XML_Schema OSM].
		+
		+	Ze względu na wiele różnic pomiędzy używanymi typami i konwencjami w UMP oraz OSM, otrzymywany plik jest uproszczoną wersją dostosowaną
		+	dla celów rysowania. W związku z tym niektóre dane nie są w nim zawarte oraz może zawierać dodatkowe modyfikacje, które pozwoliły zamaskować różnice między formatami.
		+
		+	Przykładowo OSM zawiera zaledwie kilka typów określających miasto, tymczasem w UMP jest ich kilkanaście w zależności od wielkości.
		+	Do konwersji użyty został programik oparty o źródła pobrane z http://code.google.com/p/mp2osm/.
		+	Modyfikacje konwertera obejmowały zarówno zmiany kodu jak i definicji reguł konwersji.
		+
		+	Aktualnie wygenerowany plik ump.osm.gz (po spakowaniu) zajmuje ok 100MB i stanowi podstawę do renderingu kafelków wyświetlanych w przeglądarce WWW.
		+
		+	=== Renderowanie: Mapnik ===
		+	Dalej, uzyskany plik xml jest przetwarzany tak samo jak w przypadku OpenStreetMap, co zostało opisane dokładnie na właściwym Wiki:
		+
		+	http://wiki.openstreetmap.org/wiki/Deploying_your_own_Slippy_Map
		+
		+	Oprogramowanie serwera renderującego obejmuje:
		+	* [http://wiki.openstreetmap.org/wiki/Mapnik Mapnik] - silnik renderujący kafelki
		+	* [http://wiki.openstreetmap.org/wiki/PostGIS Postgresql + PostGIS] - baza danych przestrzennych, do której importowane są dane
		+	* [http://wiki.openstreetmap.org/wiki/Osm2pgsql osm2plsql] - importer danych z OSM do bazy postgis
		+	* [http://wiki.openstreetmap.org/wiki/Mod_tile apache2 + mod_tile] - moduł apache2 wykorzystujący Mapnik'a do dynamicznego generowania kafelków i obsługi cache
		+
		+	Modyfikacje tego etapu polegały jedynie na dostosowaniu definicji styli dla specyficznych warunków UMP-pcPL oraz poprawione zostały
		+	niektóre parametry odpowiedzialne za poziom wyświetlania oraz grubość dróg. Różnice można zaobserwować porównując warstwę UMP i OSM.
		+
		+	Ponieważ liczba kafelków obejmujących samą Polskę, nie wspominając o Europie, przekracza kilka milionów, tylko część z nich jest wstępnie
		+	wygenerowana, reszta tworzona jest dynamicznie na żądania. W momencie update'u istniejące kafelki są ponownie odrysowywane równolegle
		+	z obsługą zapytań WWW.
		+
		+	Przebiega to podobnie jak w przypadku OSM: http://wiki.openstreetmap.org/wiki/Slippy_Map
		+
		+	=== Podsumowanie ===
		+
		+	Większość wiedzy potrzebnej do przygotowania wersji WWW map UMP-pcPL zaczerpnąłem ze stron:
		+
		+	http://wiki.openstreetmap.org/wiki/Main_Page
		+
		+	gdzie praktycznie [http://wiki.openstreetmap.org/wiki/Deploying_your_own_Slippy_Map krok po kroku] zostało opisane jak przygotować własną mapę WWW. Głównym problemem było więc przeniesienie kodów z formatu *.mp do *.osm oraz przystosowanie konwencji UMP-pcPL do [http://mapnik.org/ Mapika], którego gotowa konfiguracja zoptymalizowana była mocno pod kątem [http://www.openstreetmap.org/ OpenStreetMap]. Przez wykorzystanie gotowych komponentów możliwe było bardzo szybkie przygotowanie mapy online UMP (w weekendy i w wolnych chwilach przez 1-2 miesięce), a efektem ubocznym jest duże podobieństwo wyglądu do map OSM :) .
		+
		+	[[Użytkownik:Mar rud|Marcin Rudowski]]
	[[Kategoria:Użytkowanie mapy]]		[[Kategoria:Użytkowanie mapy]]

---

Wersja z dnia 20:39, 30 gru 2008

Od grudnia 2008 r. można oglądać mapę UMP-pcPL z poziomu www.

Mapa występuje w kilku wersjach:

• http://mapa.ump.waw.pl/ump-www/ - mapka z średnim okienku i opcją zaznaczania punktu
• http://mapa.ump.waw.pl/ump-www/form.html - formularz wysyłania uwag do mapy
• http://mapa.ump.waw.pl/ump-www/iframe.html - mapka samo-dopasowująca się do widocznego obszaru, którą można wykorzystać w iframe lub po prostu otworzyć, aby mieć mapę na pełne okno przeglądarki WWW.

Spis treści 1 Korzystanie z mapy 1.1 Nawigacja 1.2 Permalink 1.3 Warstwy 1.4 Marker 1.5 Dodatkowe ozdobniki 2 Mapa UMP-pcPL na Twojej stronie 2.1 Wersja najprostsza 2.2 Dodatkowe elementy mapy 2.3 Dostosowanie konfiguracji mapy 2.4 Własna mapa od podstaw 2.4.1 OpenLayers 2.4.2 Google API 3 Szczegóły techniczne renderingu 3.1 Przygotowanie pliku importu *.osm.gz 3.2 Renderowanie: Mapnik 3.3 Podsumowanie

Korzystanie z mapy

Nawigacja

Podstawowym narzędziem nawigacyjnym jest myszka, którą można intuicyjnie przeciągać mapę. Mapa oferuje jednak więcej możliwości

• myszka: przesuwanie, rolką przybliżenie lub oddalanie, podwójne kliknięcie centruje i przybliża
• kontrolki nawigacyjne: przyciski na tle mapy ze strzałeczkami oraz +/- Dodatkowo pasek ZoomBar do bezpośredniego przeskoku na wskazane powiększenie (może być wyłączony).
• klawiatura: strzałki oraz Home/End/Page Up/Page Down do przesuwania, +/- do zmiany powiększenia. Opcja może być wyłączona na niektórych mapach, lub przy wejściu w pole tekstowe formularza

Permalink

W prawym dolnym rogu znajduje się link do aktualnego widoku mapy, który można dodać do zakładek lub przesłać znajomym. Link taki składa się z adresu bazowego strony oraz kilku parametrów, które można wykorzystać do budowania własnych linków:

• lat, lon: położenie środka widocznej mapy
• zoom: poziom powiększenia, gdzie 0 jest najniższy (jeden kafelek 256x256 zawiera cały świat)
• layers: stan widocznych warstw i nakładek

O ile lat,lon i zoom są zrozumiałe, to ostatni parametr może być lekko zagadkowy, więc najlepiej opisać na przykładzie:

http://mapa.ump.waw.pl/ump-www/?zoom=7&lat=52.33&lon=19.9&layers=B00T

Literki B/0 określają aktywność/nieaktywność warstw podstawowych. Z powyższego linku wynika że są 3 warstwy podstawowe, z których pierwsza jest ustawiona jako aktywna. Następnie występują literki T/F określające widoczność/ukrycie nakładek. W przykładzie jest tylko jedna nakładka wektorowa zawierająca warstwę wyświetlającą marker i jest ona aktywna (T)

Warstwy

W prawym górnym rogu mapy znajduje się przycisk (+) pod którym pojawia się lista dostępnych warstw. UMP@Mapnik jest podstawową warstwą zawierającą mapę UMP-pcPL i jest wyświetlana jako domyślna. Dla porównania dostępna jest również warstwa z danymi z OpenStreetMap. Inne warstwy są w celach testowych i mogą zostać usunięte.

Poza warstwami mogą wystąpić dodatkowe nakładki wektorowe. Mogą to być zbiory punktów POI lub warstwy do rysowania wielokątów/linii/punktów. Aktualnie na mapie UMP-pcPL jest aktywna na stałe warstwa do rysowania markera. W przyszłości możliwe jest wzbogacenie o dodatkowe nakładki, które mogą być włączane lub wyłączane w menu warstw poprzez odpowiednie checkboxy.

Marker

Dla celów formularza oraz możliwości generowania mapek wskazujących jakiś punkt, została utworzona wcześniej wspomniana warstwa dla markera.

O ile strona z mapą została prawidłowo przygotowana, kliknięcie na mapie powoduje dodanie markera w danym punkcie. Przy okazji mogą zostać wypełnione odpowiednie pola formularza współrzędnymi geograficznymi punktu.

Poza tworzeniem nowego punktu mapka umożliwia również linkowanie do wcześniej przygotowanego markera. Służą do tego dodatkowe parametry strony:

• mlat, mlon: współrzędne punktu markera do wyświetlenia

Przykładowy link zawierający definicję punktu do narysowania po otworzeniu strony:

http://mapa.ump.waw.pl/ump-www/?zoom=7&lat=52.33&lon=19.9&layers=B00T&mlat=52.25609&mlon=20.96567

Dodatkowe ozdobniki

W pełnej wersji na mapie poza kontrolką nawigacyjną, przyciskiem warstw oraz permalinkiem znajdują się dodatkowe kontrolki. W lewym dolnym rogu znajduje się link do strony domowej UMP (Data by...) oraz status aktualności wyświetlanych danych mapowych. W prawym dolnym rogu kolejno od dołu widoczne są:

• pozycja wskazywana przez kursor myszy
• Permalink
• orientacyjna skala aktualnego powiększenia

Mapa UMP-pcPL na Twojej stronie

Do wyświetlania mapy w przeglądarce WWW wykorzystana została biblioteka OpenLayers, jednak można użyć dowolnej biblioteki tego rodzaju (np Google API). Kafelki mają odwzorowanie i numerację taką samą jak mapy Google czy OSM więc nie powinno być problemu z użyciem innych programów korzystających z tych źródeł.

Dla ułatwienia umieszczania mapki na stronach przygotowany został kod javascript, który powinien ułatwić wstępną konfigurację. Nic jednak nie przeszkadza, aby zrobić po swojemu, wykorzystując jedynie adresy kafelków. W przygotowanej wersji wystarczy jednak umieścić minimalną ilość dodatkowych elementów, by cieszyć się mapą na swojej stronie.

TODO...

Wersja najprostsza

<script>