POLITECHNIKA KRAKOWSKA im. TADEUSZA KOŚCIUSZKI. Jan Zoń

INSTYTUT INŻYNIERII I GOSPODARKI WODNEJ POLITECHNIKA KRAKOWSKA im. TADEUSZA KOŚCIUSZKI Jan Zoń DEDYKOWANY BACK-END DLA POTRZEB WIZUALIZACJI ZJAWISK METEOROLOGICZNYCH W ŚRODOWISKU praca magisterska studia dzienne kierunek studiów: informatyka specjalność: informatyka stosowana w inżynierii środowiska promotor: dr inż. Robert Szczepanek nr pracy: 2137 data złożenia:... KRAKÓW 2008 ul. Warszawska 24, 31-155 Kraków tel/fax (+48 12) 628 20 41 e-mail: sekretariat@iigw.pl internet: www.iigw.pl

Wyobraźnia jest ważniejsza od wiedzy, ponieważ wiedza jest ograniczona A. Einstein

Dziękuję Rodzicom za wsparcie i wiarę we mnie, Dr inż. Robertowi Szczepankowi poświęcony mi czas, uwagę, i za możliwość rozwoju, którą od niego otrzymałem, Dyrekcji oraz pracownikom firmy Trax Elektronik za udostępnienie bazy danych na potrzeby implementacji systemu GMAP MVT

SPIS TREŚCI 1. Wprowadzenie...5 2. Wielkości i pomiary meteorologiczne...12 3. Techniki informatyczne w meteorologii...15 4. Narzędzia...20 4.1 Baza danych...21 4.1.1 Tabele meteorologiczne i informacyjne...25 4.2 PHP Hypertext Preprocessor...32 4.3 Extensible Markup Language - XML...35 4.3.1 Reguły tworzenia dokumentów XML...36 4.3.2 Hierarchia elementów w dokumencie XML...39 4.3.3 Przetwarzanie dokumentów XML...41 4.4 JavaScript...42 4.4.1 Obiektowe podejście do struktury dokumentu HTML - DOM...46 4.5 Asynchronous JavaScript and XML...49 4.6 Google Maps Application Programming Interface...54 5. Projekt GMAP MVT - implementacja...58 5.1 Baza danych...61 5.2 Format XML założenia i implementacja...61 5.2.1 Źródło i zastosowany format danych...62 5.2.2. Tworzenie dokumentów XML przez skrypty PHP...68 5.3 W kierunku Google Maps JavaScript w połączeniu z AJAX...76 5.3.1 Import XML...77 5.3.2 Przetwarzanie XML...79 5.4 Prezentacja działania systemu GMAP MVT...82 6. Podsumowanie...89 7. Spis rysunków...93 8. Spis tabel...94 9. Spis listingów...94 10. Bibliografia...95

1. WPROWADZENIE 5

Człowieka od wieków interesowało otaczające go środowisko naturalne, próbował poznawać mechanizmy i zasady kierujące ekosystemem w którym przebywa. Zagadnieniami, które są najczęściej kojarzone z osłoną meteorologiczną są takie zjawiska jak opad atmosferyczny, wilgotność, zachmurzenie, wiatr, temperatura czy obecność mgły. Zjawiska atmosferyczne wpływają na człowieka. Wiele lat temu, gdy ludzkość nie dysponowała skomplikowanymi urządzeniami i aparaturą pomiarową, wiele z nich pozostawało dla człowieka niewytłumaczalnych. Wraz z postępem cywilizacyjnym i kolejnymi wynalazkami, człowiek stopniowo uświadamiał sobie prawa kierujące przyrodą i chętniej korzystał z dobrodziejstw nauki. W dzisiejszych czasach postęp w dziedzinie meteorologii i prognozowania jest mocno zaawansowany. Ogólnoświatowe systemy osłony meteo potrafią przewidywać nadchodzące kataklizmy, ratując życie setek tysięcy ludzi rocznie oraz zapewniając poczucie bezpieczeństwa. Jednakże pomimo stosowania zaawansowanych technik w meteorologii, człowiek nie potrafi wpływać bezpośrednio na zjawiska atmosferyczne. Możliwe jest natomiast zapobieganie skutkom ich niekorzystnych następstw poprzez projektowanie i wdrażanie systemów osłony meteorologicznej. Kilka dekad temu, najpopularniejszym i najbardziej dostępnym medium informujących ludzi o warunkach pogodowych było radio. Wraz z wynalezieniem technologii umożliwiającej przesył obrazu za pomocą fal elekromagnetycznych, przekaz werbalny został uzupełniony o obraz telewizyjny. W latach 60 ubegłego wieku miał miejsce kolejny przełom w dziedzinie przesyłania informacji na odległość. Było to podjęcie przez amerykańską Agencja Bezpieczeństwa Narodowego (RAND) decyzji o rozpoczęciu opracowywawnia skutecznej metody komunikacji do zastosowań militarnych na wypadek wybuchu wojny nuklearnej. Projekt przygotowywany przez RAND przy wsparciu Paula Barana uważa się za poczatki globalnej sieci Internet. W dzisiejszych czasach klasyczne metody zapisu i interpretacji danych meteo takie jak dzienniki opadu, temperatur lub stanu wód zastępowane są przez zautomatyzowane urządzenia i czujniki pomiarowe. Zmierzone wielkości trafiają do wyspecjalizowanych systemów komputerowych, na których gromadzone są 6

w dedykowanych bazach danych. Bardzo ważnym jest, aby informacja o potencjalnych zagrożeniach wynikających z następstw zjawisk atmosferycznych trafiała do zainteresowanego użytkownika w możliwie jak najkrótszym czasie. Równie ważna z punktu widzenia użytkownika jest dostępność tych danych oraz możliwość ich prostej i jednoznacznej interpretacji. Rozwiązaniem zapewniającym ww. warunki jest wykorzystanie globalnej sieci Internet jako medium służącemu gromadzeniu i publikacji zebranych danych. Analizując tempo przyrostu liczby zarejestrowanych domen Internetowych na przestrzeni ostatnich lat można stwierdzić, że Intenet z roku na rok staje się coraz bardziej globalny i dostępny dla szerokiej rzeszy użytkowników (Rysunek 1). Rysunek 1. Liczba zarejestrowanych na świecie domen internetowych źródło: Internet Systems Consortium, [2] Globalny w przenośni, jak również w dosłownym tego słowa znaczeniu, gdyż od kilku lat możliwe jest oglądanie powierzchni kuli ziemskiej, dzięki usłudze stworzonej przez firmę Google, noszącej nazwę Google Maps. Na podstawie interfejsu programistycznego - udostępnionego przez firmę Google - Google Maps API (Application Programming Interface), możliwe jest umieszczanie i wizualizacja na mapach świata rozmaitych obiektów. 7

Manipulacje mapą Google przesuwanie, przybliżanie i oddalanie - oparte są na użyciu JavaScriptu, obiektowego skryptowego języka programowania. Skrypty JavaScript najczęściej umieszczane są na stronach WWW i służą do zapewnienia interaktywności poprzez reagowanie na zdarzenia takie jak wciśnięcie przycisku, przeciągnięcie elementu w inne miejsce ekranu. Ponadto, JavaScript potrafi wykorzystywać technikę AJAX (ang. Asynchronous JavaScript and XML), stosowaną do tworzenia aplikacji internetowych w których interakcja pomiędzy użytkownikiem a serwerem może się odbywać bez przeładowywania całej strony WWW. Dane przekazywane przez interfejs AJAX mogą być zapisywane w formacie XML. Istnieje wiele serwisów o różnorodnej tematyce korzystających z Google Maps. Przykładowo, jedną z witryn internetowych wizualizujących na mapie Google położenie sieci hoteli w USA jest http://www.hotel-map.4hotels.us, podobną funkcjonalność posiada polska strona: http://www.fullinfo.pl/katalog/299info20.html. Do grona obiektów które znalazły się na mapach Google zaliczają się również między innymi stacje benzynowe: http://www.fullinfo.pl/katalog/497info20.html oraz obiekty turystyczne: http://www.fullinfo.pl/katalog/12info20.html Rysunek 2. 8

Rysunek 2. Kopalnia Soli w Bochni przedstawiona na mapie Google źródło: Lokalizator internetowy, [8] Jest to jednak tylko mały ułamek tematyki, jaką można zaprezentować na mapie Google, w zasadzie jedynym ograniczeniem jest wyobraźnia oraz pomysłowość projektanta. W niniejszej pracy opisany został system łączący dane zapisane w formacie XML z interfejsem Google Maps API. Dane, z których korzysta stworzony system pobierane są z meteorologicznej bazy danych należącej do krakowskiej firmy Trax Elektronik, a następnie są konwertowane do postaci dokumentów XML. Jest to podyktowane faktem udostepniania przez Google Maps API mechanizmów obsługi dokumentów XML. Informacje zapisane w formacie XML pozwalają na umieszczanie na mapie Google różnego rodzaju punktów (markerów) wizualizujących sytuację meteorologiczną. Jest to popularny sposób wizualizacji grup obiektów. 9

Do umieszczenia punktu na mapie potrzebne są jego współrzędne geograficzne tj. długość oraz szerokość geograficzna. W stworzonym systemie wykorzystana została bazy danych, w której zapisane są informacje o położeniu przestrzennym punktów pomiarowych, co pozwala na umieszczenie ich na mapie Google. Wybrany sposób prezentacji danych, a więc wizualizacja obiektów na mapie jest dużo bardziej atrakcyjna dla użytkownika w porównaniu do przedstawiennia tych samych danych w tabelach i zestawieniach. Poza aspektem przejrzystości, istotny jest również również fakt tego, że interfejs dostarczany przez Google jest bardzo intuicyjny oraz posiada wiele możliwości i rozmaitych funkcji, które można samodzielnie rozbudowywać aby osiągnąć zamierzony efekt. Dostęp do bazy danych możliwy jest dzięki wykorzystaniu języka PHP (ang. PHP hypertext preprocessor). Jest to obiektowy, działający po stronie serwera język skryptowy, służący do dynamicznego generowania dokumentów. Posiada on moduły wyspecjalizowane w kierunku komunikacji skryptu z bazą danych umożliwiające nawiązanie połączenia oraz wykonywanie zapytań o zawartość bazy i zwracanie ich wyników do skryptu w postaci zmiennych. W stworzonym systemie na podstawie danych pobranych z bazy tworzone są pliki (dokumenty) w formacie XML. Jest to możliwe, podobnie jak pobieranie danych z bazy, także przez wykorzystanie języka PHP. Pozwala on wygenerować kompletny i poprawny dokument XML, w którym zapisane są informacje zwrócone z meteorologicznej bazy danych. Przygotowana w ten sposób porcja danych następnie zostaje przekazana do odpowiednio zaprojektowanych aplikacji, przetwarzających dane wejściowe w formacie XML do formatu zrozumiałego przez interfejs Google Maps. Aby osiągnąć współdziałanie między zupełnie odrębnymi komponentami jakimi są format XML oraz mapa Google, konieczne jest użycie narzędzia pośredniego, w postaci języku JavaScript w którym napisany został autorski zestaw 10

narzędzi programistycznych. Umożliwiają one wyświetlenie na mapie Google informacji meteorologicznych w swobodny i konfigurowalny przez użytkownika sposób. Rysunek 3. Zarys projektowanego zestawu narzędzi źródło: opracowanie własne Podsumowując, projektowany system składa się z trzech odrębnych komponentów. Pierwszym z nich jest meteorologiczna baza danych. Na jej podstawie dzięki wykorzystaniu języka PHP tworzone są dokumenty w formacie XML. Następnie ich zawartośc jest wizualizowana na mapie dostarczanej przez interfejs Google Maps (Rysunek. 3) Stworzony system GMAP MVT (Google Maps, Ajax and PHP Meteo Visualization Toolkit) jest zestawem narzędzi służących do wizualizacji zjawisk meteorologicznych opartym na Google Maps, Ajax oraz PHP. W dalszej części pracy będę posługiwał się skróconą nazwą GMAP. 11

2. WIELKOŚCI I POMIARY METEOROLOGICZNE 12

Meteorologia jest nauką, która zajmuje się badaniem zjawisk fizycznych i procesów zachodzących w atmosferze kuli ziemskiej. Obserwacje atmosfery prowadzone są w placówkach pomiarowych zwanych stacjami meteorologicznymi. Są one także miejscem akwizycji pomiarów. Urządzenia pomiarowe umieszczane są w tzw. ogródku meteorologicznym dotyczy to pomiarów naziemnych. Przykładowy wygląd ogródka meteorologicznego znajduje się na rysunku 4. Rysunek 4. Ogródek meteorologiczny źródło: Instytut Meteorologii i Gospodarki Wodnej, [4] Do mierzonych w ogródku meteorologicznym wielkości można zaliczyć: temperaturę powietrza, ciśnienie atmosferyczne, wilgotność powietrza oraz kierunek i prędkość wiatru. Każda z nich mierzona jest za pomocą specjalnych, odpowiednich dla danego typu pomiaru instrumentów pomiarowych. Dla potrzeb systemu GMAP wykorzystywane są dane pochodzące z systemu stacji meteorologicznych, należących do firmy Trax Elektronik. W ogródkach dokonywany jest pomiar następujących wielkości: temperatury powietrza: pomiar dokonywany jest za pomocą termometrów rtęciowych. Umieszczone w ażurowej klatce meteorologicznej, mierzą temperaturę powietrza na wysokości 2 metrów. Pomiar temperatury na 13

powierzchni gruntu oraz na wysokości 20 centymetrów odbywa się odpowiednio przy pomocy termometrów gruntowych oraz przygruntowych. wilgotności względnej: wyraża procentową zawartość nasyconej pary wodnej w powietrzu. Mierzona jest przez urządzenia zwane higrometrami, które umieszczane są w klatkach meteorologicznych. Coraz powszechniej stosowane są urządzenia cyfrowe kombinowane termohigrometry. prędkości oraz kierunku wiatru: Pomiar prędkości wiatru dokonywany jest urządzeniem zwanym anemometrem. W kontekście omawianego systemu zastosowane zostały anemometry mechaniczne (rotacyjne). Składają się one z wirnika złożonego z łopatek zakończonych półkolistymi czaszami. Kierunek wiatru określany jest za pośrednictwem skrzydła zamontowanego podobnie jak anemometr na mierzącym kilka metrów maszcie. stanu opadu atmosferycznego: opadem nazywane są produkty kondensacji pary wodnej zawartej w atmosferze (atmosfera ziemska), spadające na powierzchnię Ziemi lub unoszące się w powietrzu w postaci wody lub kryształków lodu. Opady atmosferyczne mogą występować pod postacią:deszczu, śniegu, mżawki, krup, gradu, mgły lub opadów osiadających rosy, szronu oraz szadzi. Do pomiarów opadu atmosferycznego służą deszczomierze (najpopularniejszy Hellmana) i pluwiografy. Ilość opadu określana jest wysokością wody wyrażoną w milimetrach. 14

3. TECHNIKI INFORMATYCZNE W METEOROLOGII 15

Projektowanie i wdrażanie systemów osłony meteorologicznej jest podstawą przewidywania klęsk żywiołowych. Straty materialne w wielu przypadkach są nieuniknione, jednak posiadając odpowiednią infrastrukturę wczesnego ostrzegania o zbliżającym się huraganie lub powodzi, można je zminimalizować. Powódź, która dotknęła Polskę w 1997 roku spowodowała śmierć 55 osób i przyniosła kolosalne straty materialne w skali całego państwa. Całkowicie zniszczonych zostało kilkaset domów, mostów, wiele setek kilometrów dróg, wodociągów i studni gospodarczych, infrastruktura energetyczna, ciepłownicza, kanalizacyjna i oczyszczalnie ścieków. [4]. Stało się jasnym, że potrzebne jest stworzenie od podstaw systemu wczesnego ostrzegania o klęskach żywiołowych na terenie Polski. Dzięki wsparciu Banku Światowego, Instytut Meteorologii i Gospodarki Wodnej przygotował i wdrożył projekt Systemu Monitoringu i Osłony Kraju SMOK. SMOK jest nowoczesnym systemem obejmującym monitoring, prognozowanie oraz ostrzeganie przed groźnymi zjawiskami naturalnymi (powodzie, silne wiatry, burze). Do jego zadań należy również rozpowszechnianie informacji o aktualnym i przewidywanym stanie atmosfery i hydrosfery [4]. W skład SMOK wchodzi blisko 970 posterunków pomiarowych. Dokonują one takich pomiarów jak: stan wody w rzekach, temperatura wody w rzekach, stan wody gruntowej, opad atmosferyczny ciekły, prędkość oraz kierunek wiatru, temperatura powietrza w klatce i przygruntowa Posterunki pomiarowe przesyłają swoje pomiary do serwera, który gromadzi je w bazie danych. W skład systemu teleinformatycznego SMOK wchodzi m.in. duża grupa serwerów bazodanowych oraz superkomputer obliczający prognozy na podstawie przeprowadzanych pomiarów Rysunek 5. 16

Rysunek 5. Prognozujący superkomputer SGI Origin 3800 źródło: Instytut Meteorologii i Gospodarki Wodnej, [4] Korzyści płynące z połączenia dziedzin meteorologii oraz informatyki są długoterminowe i wymierne. Dzięki archiwizacji informacji z wielu punktów pomiarowych możliwe jest tworzenie dokładnych i przekrojowych zestawień danych. Możliwe jest również prowadzenie dzienników pomiarowych w czasie rzeczywistym dzięki wykorzystaniu łączności radiowej i internetowej pomiędzy infrastrukturą pomiarową a gromadzącą dane. Niniejsza praca skupia się na zagadnieniach związanych ze sposobem połączenia wyników pomiarów meteorologicznych z systemem informatycznym, dedykowanym do ich wizualizacji. Wykorzystano w niej zbiór urządzeń pomiarowych oraz infrastrukturę teleinformatyczną, w szczególności dostęp do bazy danych meteorologicznych krakowskiej firmy Trax Elektronik. System stworzony przez firmę przypomina SMOK IMGW, składa się z meteorologicznych stacji pomiarowych, punktów akwizycji obrazu (tzw. punktów kamerowych) oraz urządzeń przesyłających zarejestrowane informacje do wyspecjalizowanej w tym celu bazy danych. Stacje meteorologiczne firmy Trax Elektronik wyposażone są w urządzenia rejestrujące, które gromadzą w swojej pamięci wyniki pomiarów (temperaturę, wilgotność względną, wysokość opadu, prędkość oraz kierunek wiatru). Odbywa się to w 10-minutowych odstępach czasu. Do rejestratora podłączony jest modem pracujący w technologii GPRS 17

(General Packet Radio Service), który umożliwia przesyłanie pakietów zawierających wartości zmierzonych wielkości do danych serwera meteorologicznego. Pakiety danych są następnie dekodowane i zapisywane w meteorologicznej bazie danych. Zastosowanie technologii GPRS umożliwia łączność na bardzo dużych odległościach i w trudno dostępnych lokalizacjach - Rysunek 5. Rysunek 6. Schemat ideowy podsystemu akwizycji i archiwizacji danych źródło: opracowanie własne Zaprojektowany system GMAP zakłada wykorzystanie istniejącej bazy danych jako źródła niezbędnych informacji związanych zarówno z wielkościami meteo, jak również tych związanych z aspektami konfiguracyjnymi tworzonego systemu. Meteorologiczna baza danych traktowana jest w systemie firmy Trax Elektronik jako: magazyn i archiwum danych meteo, magazyn i archiwum obrazów kamerowych, magazyn informacji o komponentach (stacje pomiarowe, punkty akwizycji obrazu), interfejs udostępniający możliwość pobierania i obróbki uzyskanych wartości. W systemie GMAP jest ona traktowana w analogiczny sposób. Szczegółowe informacje dotyczące tej kwestii znajdują się w rozdziale 5. 18

Stan obecny i perspektywy rozwoju GMAP ograniczony jest zasięgiem do danych zawartych w meteorologicznej bazie danych firmy TraxElektronik. GMAP wykorzystuje za pośrednictwem języka PHP informacje o położeniu geograficznym obiektów (stacji meteorologicznych, punktów kamerowych) zapisanych w bazie danych. Stan na dzień 1 czerwca 2008r wynosi ok. 500 stacji meteorologicznych oraz ok. 250 punktów kamerowych. Na rysunku 7 przedstawione zostały stacje meteorologiczne należące do Generalnej Dyrekcji Dróg Krajowych i Autostrad (GDDKiA). W miarę rozwoju systemu i instalowania kolejnych punktów pomiarowych oraz kamer, liczby te wzrosną, tym samym zwiększy się zasięg GMAP. Liczniejsze stacje meteo ulokowane w pewnym ograniczonym obszarze pozwalają na dokładniejszą analizę panujących warunków atmosferycznych. Rysunek 7. Stacje meteorologiczne GDDKiA w systemie firmy Trax Elektronik źródło: firma Trax Elektronik, [5] 19

4. NARZĘDZIA 20

Do stworzenia programistycznych, systemu dzięki którym GMAP niezbędny możliwe było był komplet zamieszczenie narzędzi informacji pochodzących z meteorologicznej bazy danych na mapie Google. Przetransformowanie informacji zapisanych w bazie danych do formatu xml odbyło się za pośrednictwem skryptów napisanych w języku PHP. Stworzenie interfejsu umożliwiającego nanoszenie danych meteorologicznych na mapę Google możliwe było dzięki wykorzystaniu skryptów zapisanych w języku PHP, JavaScript oraz technologii AJAX. Narzędzia, języki programowania i technologie wykorzystane do implementacji systemu GMAP zostały szczegółowo opisane w kolejnych podrozdziałach. 4.1 BAZA DANYCH Baza danych jest zbiorem wzajemnie powiązanych danych, przechowywanych w pamięci komputerów i wykorzystywanych przez programy użytkowe instytucji lub organizacji wraz z oprogramowaniem umożliwiającym definiowanie, wykorzystywanie i modyfikowanie tych danych [1]. W potocznym ujęciu, pojęcie bazy danych obejmuje dane oraz program komputerowy wyspecjalizowany do gromadzenia i przetwarzania tych danych. Program taki (często pakiet programów) nazywany jest Systemem do zarządzania bazą danych (ang. DataBase Management System, DBMS). Historia komputerowych baz danych sięga lat 60' ubiegłego wieku. Początkowo, bazujące na opracowaniu Charlesa Bachmana systemy komputerowych baz danych wykorzystywały szeregowy, przez co bardzo wolny dostęp do zgromadzonych informacji. Wraz z wprowadzeniem na rynek urządzeń umożliwiających swobodny dostęp do 21

danych, zmienił się sposób implementacji samych baz. W 1970r Edgar Frank Codd zaproponował relacyjny model, który miał pozwalać na łączenie danych dotyczących tych samych obiektów przechowywanych w różnych zbiorach. Nowoczesne relacyjne bazy danych pozwalają na wykonywanie szeregu operacji na przechowywanych danych, w szczególności na sortowanie według dowolnie zdefiniowanych kryteriów. Operacje te mogą być dowolnie łączone i rozbudowywane - służą do tego specjalne języki, z których najpopularniejszymi jest SQL (ang. Structured Query Language). Nowoczesne relacyjne bazy danych mogą gromadzić dane różnych typów. Najpopularniejsze z nich to: bool - wartości bool'owskie (prawda / fałsz) byte, integer, float, double wartości liczbowe, char, varchar, text - łańcuchy znakowe (string), time, timestamp data i czas Nie brakuje również możliwości zapisu danych specjalistycznych typów [6]: bytea dane binarne, polygon typ reprezentujący wielokąt, inet typ reprezentujący adres internetowy, macaddr typ reprezentujący adres MAC urządzenia, Wymienione wyżej typy zaimplementowane zostały w relacyjnym systemie bazodanowym PostgreSQL 8.3.1 [6]. Ich nazwy oraz ilość rezerwowanego na nie miejsca w pamięci dyskowej różni się między systemami bazodanowymi innych producentów, dlatego więc projektując bazę danych od podstaw, należy uważnie zaznajomić się z jej dokumentacją. Ilość typów danych oraz ich różnorodność pozwala projektować bazy danych w sposób dostosowany do i odpowiadający wymaganiom funkcjonalnym 22

użytkownika. Duże znaczenie podczas podejmowania decyzji o wykorzystaniu danego typu ma jego wielkość, czyli rezerwowany dla niego obszar w pamięci dyskowej komputera. Wybór nieodpowiednich typów danych może skutkować nadmiernym zapotrzebowaniem na przestrzeń dyskową w miarę rozrastania się bazy danych. Bazy danych przechodzą ciągłą ewolucję, kolejne implementacje zyskują na wydajności, poprawie bezpieczeństwa i niezawodności. Posiadają mechanizmy umożliwiające zdalną pracę (na przykład programy: PgAdmin,MySqlAdmin, psql, interfejsy stworzone za pomocą języka PHP opisane w rozdziale 5.2.2). Typowym i nieodzownym komponentem nowoczesnych baz danych są możliwości wielodostępu oraz definiowania użytkowników na wielu poziomach uprawnień. Czyni je to użytecznymi i godnymi uwagi w wielu dziedzinach zastosowań - Rysunek 8. Rysunek 8. Perspektywa korzystania z bazy danych z punktu widzenia dostępu oraz uprawnień użytkowników źródło: opracowanie własne W zależności od preferencji lub specyfiki środowiska operacyjnego, pod kontrolą którego ma pracować baza danych, możliwa jest instalacja odpowiadających sobie baz danych pracujących na różnych platformach sprzętowych oraz systemowych (Windows, Linux, Solaris). Przykładami popularnych i nieustannie rozwijanych relacyjnych baz danych są MySQL, PostgreSQL oraz Oracle. Dwie pierwsze z nich są darmowe, natomiast 23

Oracle jest bazą wymagającą płatnej licencji. Każda z nich do obsługi zapytań oraz pozostałych operacji wykorzystuje język SQL. Za jego pomocą można tworzyć również kopie zapasowe danych, które są łatwo przenaszalne pomiędzy różnymi systemami operacyjnymi. Jest to kluczowe z punktu widzenia bezpieczeństwa i archiwizacji. SQL realizuje założenia relacyjnej bazy danych zawarte w akronimie CRUD wymienione w tabeli 1. Każda relacyjna baza danych musi implementować funkcje tworzenia, odczytu, aktualizacji oraz usunięcia elementów, które przechowuje. Tabela 1. Założenia CRUD źródło: opracowanie własne Polskie tłumaczenie Odpowiednik SQL Create utwórz insert Read odczytaj select Update zaktualizuj update Delete (destroy) usuń (zniszcz) delete Zarówno programista jak i użytkownik dysponując potężnym narzędziem jakim jest baza danych może w sposób bezpieczny i wydajny przechowywać, wstawiać oraz odczytywać dane w niej zakodowane. Z uwagi na ciągły rozwój oprogramowania baz danych oraz poszerzania się spektrum ich wykorzystania, pewnym jest, że chcąc gromadzić dane w sposób nowoczesny i systematyczny nieuniknione jest wykorzystanie do tego celu komputerowej bazy danych. System GMAP wykorzystuje meteorologiczną bazę danych należącą do firmy Trax Elektronik. Podstawową bazodanową jednostką magazynującą informacje strukturalnie i logicznie ze sobą powiązane są tabele. W skład każdej z tabel wchodzą wiersze (krotki). Z kolei każdy wiersz w tabeli składa się z pól. Posiadają one unikalną w obrębie tabeli nazwę oraz niosą informację o typie danych które są w nich przechowywane. 24

4.1.1 TABELE METEOROLOGICZNE I INFORMACYJNE Dane w bazie firmy Trax Elektronik przechowywane są w tabelach, które zostały podzielone na informacyjne oraz meteorologiczne. Dla lepszego zobrazowania zależności pomiędzy poszczególnymi tabelami, został stworzony diagram ERD (ang. Entity Relationship Diagram) - diagram związków encji przedstawiony na rysunku 9. Rysunek 9. Relacje pomiędzy tabelami bazodanowymi projektowanego systemu źródło: opracowanie własne Na rysunku 9 przedstawione zostały kluczowe z punktu widzenia zaprojektowanego systemu GMAP tabele bazodanowe wraz z polami, które wchodzą w ich skład. Tabele meteorologiczne zostały wyróżnione kolorem niebieskim, natomiast tabele informacyjne zostały wyróżnione kolorem czerwonym. Tabela stacje jest tabelą informacyjną jednak ze względu na jej szczególny charakter na diagramie 25

zaznaczona została kolorem czarnym. Ponadto, diagram zawiera relacje między konkretnymi polami w tabelach: relacja 1:1 oznacza relację jeden do jednego relacja 1:1..n oznacza relację jeden do wielu Dodatkowymi oznaczeniami są: PK klucz podstawowy tabeli (ang. Primary Key) FK klucz obcy (ang. Foreign Key) PF klucz podstawowy/obcy (ang Primary/Foreing key) Klucz podstawowy identyfikuje rekord (krotkę) w sposób unikalny. Klucz obcy wskazuje na referencję do klucza podstawowego znajdującego się w innej tabeli. Jak widać na rysunku 9, aby uzyskać dane pomiarowe pochodzące ze stacji o wybranym identyfikatorze (stid), należy wykorzystać trzy dodatkowe tabele: pakiety, pomiary oraz wielkości. Z kolei aby dysponować kompletem informacji o danej stacji pomiarowej, potrzebne jest dodatkowo połączenie tabel rejony oraz pkamerowe. TABELE INFORMACYJNE Jak już było wspomniane wcześniej w rozdziale 3, w skład systemu firmy Trax Elektronik wchodzą urządzenia pomiarowe (stacje meteo oraz punkty kamerowe). Reprezentacja bazodanowa stacji meteorologicznych przedstawia się w sposób przedstawiony w tabeli 2. Tabela bazodanowa stacje zawiera informacje o pracujących w systemie stacjach meteorologicznych. 26

Tabela 2. Tabela bazodanowa stacje źródło: opracowanie własne Nazwa pola stid (PK)1 stacja szer dlug rejid ip Typ zmiennej smallint text real real integer inet przykład 44 Nowogród 53.231 21.787 33 213.44.11.6 Objaśnienia poszczególnych pól: stid: numer identyfikacyjny stacji, typ: small int (zapisany na 2 bajtach) stacja: nazwa stacji pod jaką figuruje ona w systemie, typ: text napis szer: współrzędna określająca szerokość geograficzną na jakiej zlokalizowana jest stacja, typ: real wartość zmiennoprzecinkowa zapisana na 4 bajtach dlug: współrzędna określająca długość geograficzną na jakiej zlokalizowana jest stacja, typ: real rejonid: identyfikator rejonu, do którego stacja przynależy, typ: integer wartość całkowita zapisana na 4 bajtach Tabela rejony Zawiera ona informację o rejonie do którego przynależy dana stacja. Jej obecność pomaga w identyfikacji oraz klasyfikacji grupy stacji biorąc pod uwagę kryterium ich położenia na mapie Polski - tabela 3. Tabela 3. Tabela bazodanowa rejony źródło: opracowanie własne Nazwa pola rejid (PK) nadrzedny rejnazwa Typ zmiennej integer integer text przykład 44 13 warszawa 1 PK (Primary Key) z ang. klucz podstawowy. Jednoznacznie identyfikuje rekord w tabeli,jego wartość musi być unikalna w obrębie tabeli. 27

Objaśnienia poszczególnych pól: rejid: unikalny numer identyfikacyjny rejonu, typ: integer wartość całkowita zapisana na 4 bajtach, nadrzedny: wskaźnik do numeru identyfikacyjnego rejonu nadrzędnego względem aktualnie rozpatrywanego, typ: integer wartość całkowita zapisana na 4 bajtach, rejnazwa: nazwa rejonu, typ: text napis. Tabela pkamerowe W tej tabeli zapisane są informacje potrzebne do przypisania stacji meteorologicznej odpowiadającego jej punktu kamerowego, oraz wydobycia informacji o położeniu plików z obrazami zarejestrowanymi przez zainstalowane kamery - tabela 4. Tabela 4. Tabela bazodanowa pkamerowe źródło: opracowanie własne Nazwa pola pkamid (PK) pkamnum pkamnazwa pkamdir Typ zmiennej serial smallint text text przykład 54 186 Wojtachowice zielona_gora Objaśnienia poszczególnych pól: pkamid: unikalny numer identyfikacyjny punktu kamerowegom, typ: serial wartość całkowita, autoinkrementująca się, zapisana na 4 bajtach pkamnum: numer punktu kamerowego, jest odnośnikiem do tabeli stacje. Stacje pomiarowe posiadające punkt kamerowy będą posiadać odpowiadający im wpis w tabeli pkamerowe. Typ: smallint wartość całkowita zapisana na 2 bajtach. Pkamnazwa: nazwa punktu kamerowego w systemie, typ: text napis pkamdir: wskazuje ścieżkę przeszukiwań obrazów zgromadzonych na serwerze, typ: text napis 28

TABELE METEOROLOGICZNE Do tabel meteorologicznych projektowanego systemu należą: pakiety, pomiary oraz wielkości. Schemat ich zależności tabelami zaprojektowany został w sposób umożliwiający przypisanie każdej ze stacji zmierzonych przez nią wartości wraz z uwzględnieniem czasu w którym zostały one przesłane do bazy danych. Tabela pakiety Zawiera informację o pojedynczej porcji danych (pakiecie) przesłanym przez stację meteo do serwera bazy danych tabela 5. Tabela 5. Tabela bazodanowa pakiety źródło: opracowanie własne Nazwa pola pktid (PK) stid measured Typ zmiennej integer smallint timestamp przykład 75347943 379 2007-02-08 13:40:00+01 Objaśnienia poszczególnych pól: pktid: unikalny numer pakietu w systemie bazy danych, typ: integer - wartość całkowita zapisana na 4 bajtach stid: identyfikator stacji meteo, wskazuje na pochodzenie pakietu, typ: smallint wartość całkowita zapisana na 2 bajtach measured: czas zmierzenia pakietu, typ: timestamp - znacznik czasowy. Tabela pomiary Przyporządkowuje pakietowi o wybranym identyfikatorze pakietu (pktid) wartość oraz identyfikator pomiaru. Nie zawiera ona klucza podstawowego. 29

Zamiast niego pomiary identyfikowane są za pomocą dwóch kryteriów: identyfikatora pakietu pktid oraz identyfikatora pomiaru pomid tabela 6. Tabela 6. Tabela bazodanowa pomiary źródło: opracowanie własne Nazwa pola pktid (PF) pomid (PF) value Typ zmiennej integer smallint real przykład 75347943 32 24.6 Objaśnienia poszczególnych pól: pktid: identyfikator pakietu, którego dany pomiar i jego rodzaj dotyczy, typ: integer - wartość całkowita zapisana na 4 bajtach, pomid: identyfikator wielkości pomiaru, typ: smallint - wartość całkowita zapisana na 2 bajtach, value: wartość pomiaru - typ real - zmiennoprzecinkowa liczba zapisana na 4 bajtach Tabela wielkosci jej poszczególne pola przedstawione są w tabeli 7. Tabela 7. Tabela bazodanowa wielkosci źródło: opracowanie własne Nazwa pola pomid (PK) pomnazwa jednostka Typ zmiennej smallint text text przykład 32 T_20 C Objaśnienia poszczególnych pól: pomid: unikalny identyfikator wielkości pomiaru,typ: integer wartość całkowita zapisana na 4 bajtach 30

pomnazwa: nazwa wielkości pomiaru, typ: text napis, jednostka: jednostka wielkości pomiaru, typ: text napis Zaprezentowany w niniejszym rodziale rzeczywisty i pracujący model bazy danych meteorologicznej jest doskonałym źródłem danych dla projektowanego systemu GMAP. Pomiary takie jak temperatura powierzni ziemi, temperatura powietrza, wilgotność, intensywność opadu oraz wiatr są umieszczane w bazie danych na bieżąco, wraz z momentem ich nadesłania ze zdalnych stacji meteo. Pozwala to pracować z wykorzystaniem aktualnych i wiarygodnych danych, ponieważ stacje wyposażone są w profesjonalne czujniki rejestrujące mierzone wielkości. Z uwagi na bardzo dużą ilość stacji pomiarowych zarejestrowanych w bazie danych oraz fakt usytuowania ich w różnych województwach Polski, projektowany system może posłużyć za miarodajną i dokładną podstawę do wizualizacji panujących warunków meteorologicznych [10]. Jednym z interfejsów przystosowanych do współpracy z wykorzystywaną bazą danych meteorologicznych jest interfejs udostępniany przez język skryptowy PHP, a w szczególności przez jego rozszerzenie o nazwie php5-pgsql. Rozszerzenie o którym mowa umożliwia formułowanych w języku SQL, odbiór zdalne wykonywanie zapytań i dalsze przetwarzanie otrzymanych rezultatów. Opis wykorzystania rozszerzenia php5-pgsql znajduje się w rozdziale 5.2.2. 31

4.2 PHP HYPERTEXT PREPROCESSOR Inspiracją do rozpoczęcia w roku 1994 prac nad projektem PHP (ang. PHP hypertext preprocessor) przez duńskiego programistę Rasmusa Lerdorfa była chęć zebrania statystyk użytkowników odwiedzających jego domową stronę WWW. Stworzył on więc zestaw narzędzi wzbogacających funkcjonalność serwera WWW, które błyskawicznie zostały zauważone i zdobyły popularność wśród społeczności internetowej. Po opublikowaniu przez Lerdorfa kodu źródłowego PHP, język ten zaczął być rozwijany przez programistów na całym świecie. Z biegiem czasu zaczęły pojawiać się nowe jego wersje, zaimplementowano w nim obiektowość (od wersji PHP 3.0), uczyniono język modułowym. Programiści mogli zatem poszerzać możliwości języka poprzez dodawanie do niego własnych modułów. Obecnie PHP definiowany jest jako obiektowy, skryptowy język programowania zaprojektowany do generowania dynamicznych stron internetowych. PHP najczęściej stosuje się do przetwarzania skryptów po stronie serwera WWW ale może być on również używany z poziomu wiersza poleceń (tzw. CLI Command Line Interface), wówczas obecność serwera WWW nie jest koniecznością. Aktualnie najnowszą wersją PHP jest wersja 5.26 z 1 mają 2008r, która wykorzystuje ponad 180 oficjalnych i nieoficjalnych modułów należących do repozytorium PECL (ang. PHP Extension Community Library). Obecne moduły PHP zwane również rozszerzeniami języka umożliwiają między innymi wykonywanie takich operacji, jak: łączenie się z różnymi rodzajami baz danych ( mysql, PostgreSQL i inne), pobieranie z nich informacji i ich prezentację 32

dynamiczne generowanie skompresowanych obrazów (obrazy jpg, png, gif i inne), zdalne otwieranie i wywoływanie plików oraz innych skryptów, autentykację użytkownika, przesyłanie danych zaszyfrowanych, nagrywanie i przetwarzanie dźwięku Składnia języka PHP przypomina swoim wyglądem znaną z języka C i podobnych. Cały kod PHP musi zawierać się pomiędzy znacznikami: <?php oraz?>, lub <? oraz?>, w przeciwnym wypadku interpreter1 nie wykona kodu. Aby łatwiej byłoby sobie wyobrazić jak wygląda kod języka PHP, przedstawiam fragment skryptu, który wykorzystywany jest przeze mnie do generowania dokumentów w formacie XML - listing 1. 1 <?php 2 header("content-type: text/xml; charset=iso-8859-2"); 3 echo "<?xml version=\"1.0\" encoding=\"iso-8859-2\"?>";... 5 foreach($ra as $stid => $fields) 6 { 7 8 echo "<station id=\"$stid\">"; 9 echo "<station_info>";... 10 } 11// To jest tylko komentarz, interpreter pomija go w trakcie przetwarzania kodu. 12?> Listing 1. Fragment skryptu PHP generującego dokument w formacie XML źródło: opracowanie własne Linie 1 oraz 12 wyznaczają odpowiednio początek oraz koniec skryptu. W linii nr 2 ustawiany jest rodzaj tworzonego dokumentu, w tym wypadku jest nim text/xml z kodowaniem znaków ISO-8859-2. Przeglądarka internetowa dzięki 1 Interpreter PHP służy do uruchamiania skryptów PHP. Jest to program, który odczytuje plik z kodem PHP a następnie przekształca go na kod maszynowy. 33

umieszczeniu tej informacji decyduje w jaki sposób interpretować treść dokumentu. ISO-8859-2 jest stroną kodową języka polskiego, której zastosowanie umożliwia poprawne wyświetlane znaków charakterystycznych dla naszego języka (ą,ę,ć,ż,ź,ó,ł,ń). Linia nr 3 za pomocą dyrektywy języka PHP o nazwie echo umieszcza w ciele dokumentu deklarację informującą o typie dokumentu. Echo jest dyrektywą, która wypisuje na ekran treść zawartą pomiędzy znakami cudzysłowów. Jeśli konieczne jest umieszczenie znaków cudzysłowu wewnątrz wyświetlanej treści, wówczas muszą być one zamaskowane przy pomocy znaku \. Linia nr 5 przedstawia przykład wykorzystania pętli foreach. Ten rodzaj pętli wykorzystywany jest do przeszukiwania zawartości tablic w języku PHP. Wszystkie zmienne, zarówno tekstowe,liczbowe jak i tablicowe muszą rozpoczynać się znakiem dolara $. Pętla foreach z linii nr 5 pozwala na przeszukanie tablicy wielowymiarowej $ra po jej indeksie zapisywanym odpowiadające aktualnie w zmiennej $stid. przeszukiwanemu Zmienna $fields indeksowi. Nie zawiera jest dane wymagane zwiększanie indeksu podczas kolejnych przebiegów pętli, język PHP robi to automatycznie. W linii 8 odbywa się złożenie napisu <station id= z zawartością zmiennej $stid oraz znaku >. Wynik złożenia jest następnie wyświetlany na ekranie za pomocą dykertywy echo. Jak widać na powyższym przykładzie język PHP jest analogiczny do innych języków programowania, przez co doświadczony programista nie będzie miał problemów związanych z poprawnym jego stosowaniem. Cechą, która przemawia na korzyść PHP względem innych obiektowych języków programowania (C++, Java) jest sposób tworzenia zmiennych i przechowywania ich w pamięci maszyny. Stosując PHP, programista unika nieraz kłopotliwego i czasochłonnego dopracowywania programu pod kątem wykorzystania pamięci operacyjnej, gdyż wszelkie operacje przydzielania i zwalniania pamięci zajmowanej przez definiowane zmienne odbywają się automatycznie. Język PHP stosowany jest w aplikacjach, od których wymaga się dostępności 34

przez Internet, aby móc z niego korzystać potrzebne jest zainstalowanie obsługi języka w serwerach WWW. Ponieważ PHP jest stabilny, dobrze udokumentowany oraz rozwijany a także posiada możliwość wykonywania za jego pośrednictwem zdalnych połączeń z bazami danych, jest on znakomitym wyborem językak który może posłużyć do zaprogramowania interfejsu umożliwiającego obsługę, pobieranie oraz obróbkę danych pochodzących z bazy danych. Popularnym i elastycznym sposobem na przechowywanie informacji pobranych z baz danych jest wykorzystanie standardu XML opisane szczegółowiej w rozdziale 4.3. Za pomocą skryptów napisanych w języku PHP możliwe jest tworzenie dokumentów XML. Język PHP z punktu widzenia projektu GMAP jest elementem łączącym bazę danych ze standardem XML. 4.3 EXTENSIBLE MARKUP LANGUAGE XML XML(ang. Extensible Markup Language) Rozszerzalny Język Znaczników jest uniwersalnym językiem formalnym1, służącym do zapisu różnorodnych danych w sposób przejrzysty i usystematyzowany. Z uwagi na sposób prezentacji danych zapisanych za pomocą XML, nadaje się on do tworzenia usług internetowych niezależnych zarówno od platformy sprzętowej, jak i innych podsystemów które będą go wykorzystywać. Cechuje się on również tym, że jest łatwy do zrozumienia z uwagi na wykorzystanie w nim znaczników, a tworzone w nim dokumenty mogą być łatwe do interpretacji przez niedoświadczonego użytkownika. Jego zaletą jest to, że nawet osoba nie znająca zasad tworzenia dokumentów XML będzie w stanie w znacznym stopniu rozszyfrować zakodowaną w nich informację. Wynika to z prostoty i harmonii tego języka [3]. Wachlarz zastosowań języka XML jest bardzo szeroki; począwszy od budowy interaktywnych 1 aplikacji Język formalny pojęcie z zakresu logiki, definiuje alfabet wraz z zakresem posługiwania się nim. 35

internetowych, przetwarzaniu danych, renderingu witryn WWW na statycznych interfejsach użytkownika skończywszy [12]. Wspomniana niezależność XML od platformy sprzętowej, umożliwiła łatwą wymianę dokumentów pomiędzy różnymi systemami i znacząco przyczyniła się do popularności tego języka w dobie Internetu. Język XML należy do podzbioru języka SGML. SGML w odróżnieniu od języków znaczników dedykowanych do konkretnych zastosowań (takich jak np. HTML (ang. Hypertext Markup Language), nie jest zbiorem określonych znaczników i reguł ich użytkowania, lecz ogólnym, nadrzędnym językiem służącym do definiowania dowolnych znaczników i ustalania zasad ich poprawnego użytkowania [17]. Organizacją, która trzyma pieczę nad ustanawianiem standardów implementacji i przesyłania witryn WWW, w tym również dokumentów XML jest założona 1 października 1994r przez Tima Berners-Lee, World Wide Web Consortium (w skrócie W3C). Każdy człowiek dąży do uporządkowania i usystematyzowania otaczającego go świata, dlatego format XML dzięki ograniczeniom oraz przejrzystym zasadom tworzenia w nim dokumentów, jest dziś tak popularnym formatem udostępniania informacji. 4.3.1 REGUŁY TWORZENIA DOKUMENTÓW XML Każdy język komputerowy, zarówno kompilowany (C, C++, Pascal), jak również język znaczników XML posiada swoje zasady oraz reguły, których należy przestrzegać podczas posługiwania się nim. Dokument XML jest poprawny składniowo (ang. well formed), jeżeli zgodny jest z regułami składni XML, mianowicie: Na początku każdego dokumentu musi znajdować się deklaracja specyficzna dla typu XML, 36

W dokumencie dopuszczalne jest istnienie dokładnie jednego unikatowego elementu głównego korzenia, Wszystkie pozostałe elementy muszą znajdować się w obrębie korzenia, Wszystkie niepuste elementy muszą posiadać znacznik początkowy i końcowy, Pusty element nie musi posiadać znacznika końcowego, dopuszcza się zagnieżdżanie elementów, jednak nie mogą one na siebie zachodzić, Jeżeli element posiada atrybut, wówczas jego wartość musi być zapisana w cudzysłowach. Poprawność strukturalna (ang. structural validity) dokumentu XML osiągnięta jest wtedy, gdy jest on zgodny ze przypisaną mu definicją dokumentu. Najpopularniejszym językiem służącym do precyzowania reguł dokumentów z rodziny SGML jest DTD (ang. Document Type Definition). Definicja dokumentu obejmuje zasady określane przez użytkownika. Należą do nich m. in.: opisy dopuszczalnych elementów w zbiorze, lista atrybutów mogących cechować poszczególne elementy, zasady zagnieżdżań poszczególnych elementów. Przykład dokumentu XML Przykład dokumentu XML przedstawia Listing 2. 1 <?xml version= 1.0 encoding= UTF-8 standalone= yes?> 2 <wypozyczalnia-video kategoria= filmy przyrodnicze > 3 <film nosnik= DVD > 4 <autor>james Attenborough</autor> 5 <tytul>africa unrevealed continent</tytul> 6 <rok-wydania>2008</rok-wydania> 7 <uwagi>nowość</uwagi> 8 </film> 9 0 <film nosnik= VHS > 11 <autor>mary Crabtree</autor> 12 <tytul>galapagos wildlife mysteries</tytul> 13 <rok-wydania>1993</rok-wydania> 14 <uwagi/> 37

15 </film> 16 </wypozyczalnia-video> 17 <!-- tak zapisywany jest komentarz do kodu --> Listing 2. Przykładowy dokument w formacie XML źródło: opracowanie własne Linijka nr. 1 jest deklaracją, informującą o typie dokumentu. W tym przypadku typem dokumentu jest XML w wersji 1.0 z kodowaniem znaków UTF-8. W przypadku jej nie umieszczenia, przeglądarka internetowa, bądź też inny program parsujący taki dokument, może niepoprawnie zinterpretować jego zawartość. W przypadku nie zaznaczenia w dokumencie systemu kodowania znaków, zamiast oczekiwanych liter, mogą pojawić się nieczytelne znaki, uniemożliwiając tym samym dalsze, poprawne przetwarzanie takiego pliku. Atrybut standalone natomiast określa, czy dokument może występować samodzielnie czy też będzie on potrzebował odwołania do zewnętrznego DTD. Jak już było wspomniane w niniejszym rozdziale, aby dokument był poprawny składniowo, musi istnieć w nim dokładnie jeden element główny korzeń. Korzeniem dokumentu - Listing 2 - przykładowego dokumentu XML mogącego opisywać katalog filmów wypożyczalni wideo jest znacznik wypozyczalnia-video. Posiada on dodatkowo jeden atrybut: kategoria. Znaczniki w XML konstruuje się w podobny sposób jak w dokumentach HTML. Przykładowy znacznik otwierający ma postać <marker> a zamykający go </marker>. XML zezwala na umieszczanie w dokumentach znaczników pustych <znacznik_pusty/>, taki znacznik zastępuje treść <znacznik_pusty> </znacznik_pusty>. Elementy puste wykorzystuje się najczęściej wtedy, gdy zawierają one wyłącznie atrybuty. Bardzo ważną kwestią jest rozróżnianie wielkości liter. Znacznik <marker> nie jest tym samym znacznikiem co <MARKER> czy <MaRker>, nie można go również zamknąć wstawiając </MARKER>. XML nie wymaga stosowania jednej, konkretnej wielkości liter, konieczna jest jednak spójność w wykorzystaniu jednego systemu nazewnictwa znaczników. Analogicznie do języka HTML, atrybuty w XML określa się w znaczniku otwierającym element. Wymagane jest, aby były one zamknięte w znaki (') lub cudzysłowy ( ). 38

Linijki 3 9 z Listingu 2. wprowadzają do dokumentu opis elementu film. Zawiera on subznaczniki niosące informację o autorze, tytule, roku produkcji oraz uwagach na temat elementu film. Dodatkowo, element film z linijki 3 posiada atrybut informujący o typie nośnika. W analogiczny sposób można definiować pozostałe elementy film, umieszczając je kolejno pod sobą, mając na uwadze, aby znaczniki nie nachodziły na siebie, oraz to aby wszystkie znalazły się w obrębie korzenia. Programista ma prawo używać komentarzy w swoich dokumentach XML. Komentarze nie są przetwarzane przez parsery1. Rozpoczęcie bloku komentarza ma postać: <!--. Aby zakończyć blok, należy domknąć komentarz sekwencją -->. Cały tekst pomiędzy tymi znakami traktowany jako komentarz [Listing 2.,linia 17]. Trzeba mieć na uwadze, że w zasadniczej treści komentarza nie może się znaleźć sekwencja dwóch myślników (--), wówczas parser zgłosi błąd. 4.3.2 HIERARCHIA ELEMENTÓW W DOKUMENCIE XML Elementy mogą przechowywać tekst (pomiędzy znacznikami: początkowym a końcowym), mogą być puste, lub zawierać kolejne elementy zwane podelementami. Elementy zawierające inne elementy nazywane są elementami nadrzędnymi. Element film jest nadrzędny wobec elementów autor, tytuł, rok-wydania, uwagi [ Listing 1., Rysunek 10.]. 1 Parser - analizator składniowy. Dokonuje analizy danych wejściowych, opierając się na zmodyfikowanych algorytmach analizy języków formalnych. 39

Rysunek 10. Przykładowa hierarchia dokumentu XML źródło: opracowanie własne Zagnieżdżając jedne elementy w drugich, umieszcza się w dokumencie XML informację o zależnościach pomiędzy elementami nadrzędnymi a podrzędnymi (podelementami). W prosty sposób można uzyskać klarowny opis relacji typu nadrzędny podrzędny (np. opis struktury pracowniczej firmy) za pomocą notacji XML. Nie bez przyczyny XML wykorzystywany jest do zapisu informacji przechowywanych w bazach danych (rozdział 5.2.1), można bowiem utworzyć za jego pomocą dokument o charakterze listy odpowiadający krotkom zapisanym w tabeli. Podsumowując, sposób formułowania dokumentów XML jest bardzo zbliżony do naturalnych opisów różnych elementów dokonywanych przez człowieka. Z uwagi na tę cechę, dokumenty XML są łatwe w czytaniu i zrozumieniu. Dodatkowo, istnieją mechanizmy sprawdzania poprawności tworzonych dokumentów (np. są one wbudowane w przeglądarki internetowe). Pozwala to ustrzec się błędów i nieścisłości, które mogą w nich wystąpić na etapie projektowania. 40

4.3.3 PRZETWARZANIE DOKUMENTÓW XML Dokumenty XML mogą być czytane przez użytkownika w zwykłych edytorach tekstowych (Notatnik, Word Windows, gedit, nano Linux), jednak w przeważającej większości przypadków są one przetwarzane przez programy zwane parserami. Parsery dokonują analizy składniowej dokumentu, czyli sprawdzają czy dany dokument jest dobrze uformowany. Schemat przetwarzania dokumentu XML przez parser został zobrazowany na rysunku 11. Rysunek 11. Schemat przetwarzania dokumentu XML przez parser źródło: na podstawie [3] Ogromna większość nowoczesnych przeglądarek internetowych (Firefox, Netscape, Opera, Internet Explorer) posiadają wbudowane parsery XML umożliwiające użytkownikowi wyświetlenie w okienku treści dokumentu. 41

Wyspecjalizowane parsery zajmują się nie tylko wyświetlaniem treści dokumentu, lecz również potrafią: przekonwertować go na stronę w języku HTML, przetworzyć zawartą w nim treść na polecenia kierowane do bazy danych, wygenerować nowy dokument i zapisać go na twardym dysku, wstępnie zmodyfikować go i przekazać innemu podsystemowi celem dalszego przetwarzania, na przykład odbiorcą może być program napisany w języku JavaScript wykorzystujący technologię AJAX. Wykorzystanie technologii JavaScript w połączeniu z AJAX jest jednym z komponentów projektowanego systemu GMAP. 4.4 JAVASCRIPT JavaScript to obiektowy skryptowy język programowania, stworzony przez Brendana Eich, programistę Netscape Communications Corporation w 1995r. Umożliwiał on zagnieżdżanie swojego kodu w stronach WWW wzbogacając je o mechanizmy dynamicznego przetwarzania liczb oraz modyfikacji danych zapisanych w formularzach, bez konieczności przeładowywania całego dokumentu. JavaScript w wersji 1.0 opublikowano dla użytkowników w 1996r. Obecną wersją JavaScriptu jest wersja oznaczona numerem 1.5, trwają jednocześnie prace nad wersją 2.0 wzbogaconą o kilka rozszerzeń dodanych przez fundację Mozilla (twórcę m. in popularnej przeglądarki internetowej Firefox). 42

Kompatybilność. JavaScript jest obsługiwany przez ogromną większość współczesnych przeglądarek internetowych m. in Mozilla Firefox, Safari,Internet Explorer, Opera, Netscape. Aby kod napisany w JavaScript mógł zostać wykonany, należy umieścić w dokumencie HTML odpowiednie znaczniki oznaczające początek oraz koniec skryptu. W przypadku, gdy przeglądarka użytkownika nie obsługuje JavaScriptu, lub jego obsługa jest wyłączona, wówczas do dobrych praktyk programisty należy, aby ten przypadek obsłużyć. Najczęściej wiąże się to z wyświetleniem alternatywnej treści przeglądanego dokumentu lub informacji dla użytkownika [ Listing 3., linia 5 ]. Użycie kodu JavaScript w dokumencie HTML. Osadzanie kodu JavaScript w dokumencie HTML jest nieskomplikowane. Robi się to poprzez umieszczenie w dowolnym miejscu dokumentu HTML znacznika otwierającego kod w JavaScript <script>. W praktyce jednak,umieszcza się go na początku strony - w sekcji HEAD - która jest wczytywana przez przeglądarki jako pierwsza. Zabieg ten pozwala na uniknięcie błędów, które mogą mieć miejsce, gdy użytkownik nie czekając na całkowite załadowanie się strony kliknie na jakiś element, który jest obsługiwany przez JavaScript. 1 <html> 2 <head> 3 <script src="./skrypt.js" type="text/javascript"> </script> 4 <script type="text/javascript"> kod skryptu </script> 5 <noscript> Przeglądarka nie obsługuje JavaScript </noscript> 6 </head>.<!-- To jest komentarz HTML. -->.<!-- Tu znajduje się pozostała część dokumentu HTML. -->. 7 <html> Listing 3. Kod JavaScript w dokumencie HTML źródło: opracowanie własne Powyżej przedstawiono bardzo skrócony fragment dokumentu HTML, jego ideą jest pokazanie w jaki sposób umieszcza się kod JavaScript w HTML. 43

Zaprezentowane są dwa podejścia umieszczania kodu JavaScript w HTML, każde ma swoje wady oraz zalety. Podejście nr 1. Jego ilustracja znajduje się w linii nr 3. Definiowane jest w tej linii źródło, czyli ścieżka dostępu do skryptu, którego kod ma zostać załadowany. Skrypt źródłowy znajduje się w bieżącym katalogu pod nazwą skrypt.js. Jego typem jest text/javascript. Deklaracja typu jest niezbędna, w przypadku jej braku przeglądarka internetowa nie będzie w stanie poprawnie przetwarzać strony HTML. Podejście nr 2. Zakłada ono, iż treść (kod) skryptu umieszczony jest pomiędzy znacznikami <script> </script>. Jak widać typ pozostaje identyczny jak w przypadku podejścia nr 1. Umieszczanie JavaScript bezpośrednio w treści dokumentu HTML (podejście nr 2.) ma jedną zaletę. Pozwala na przechowywanie kodu JavaScript i HTML w jednym, tym samym pliku, ułatwia tym samym dokonywanie zmian w obydwu kodach jednocześnie, bez konieczności odszukiwania plików źródłowych. Jednak w przypadku, gdy programista zamierza użyć tego samego kodu JavaScript w wielu stronach HTML, wówczas wygodniej i rozsądniej jest dołączyć go w postaci pliku. (podejście nr 1.). Oprócz tego, jeśli zaistnieje warunkowa potrzeba użycia pewnego kawałka kodu JavaScript (np. w zależności od rodzaju przeglądarki internetowej użytkownika), wtedy również lepszym rozwiązaniem jest ładowanie odpowiedniego pliku niż umieszczanie wszystkich przypadków użycia w jednym, nieraz obszernym kodzie włączanym bezpośrednio do dokumentu HTML. JavaScript implementuje zaawansowane i złożone techniki wpływania na zawartość stron WWW. Jest on najczęściej osadzany dokumentach HTML 44

wzbogacając ich funkcjonalność i interaktywność. JavaScript 1.5 wspiera nowy, złożony standard W3C DOM. DOM (ang. Document Object Model) czyli obiektowy model dokumentu to API dla dokumentów HTML oraz XML. Wprowadza strukturalne odwzorowanie dokumentu, pozwalając modyfikować jego zawartość i warstwę prezentacji. DOM łączy strony WWW ze skryptami lub innymi językami programowania [15]. DOM specyfikowany przez organizację W3C udostępnia zestaw obiektów odzwierciedlających dokumenty HTML oraz elementy okna przeglądarki, w szczególności za jego pomocą: możliwe jest tworzenie, usuwanie i modyfikacja elementów HTML, możliwe jest dodawanie i usuwanie atrybutów wszystkich znaczników HTML, możliwe jest dodawanie i usuwanie stylów, z jakich korzysta dana strona WWW, możliwe jest przypisanie więcej niż jednej procedury w przypadku wystąpienia zdarzenia1 wymagającego obsłużenia przez JavaScript. Są to istotne udogodnienia, pozwalające na projektowanie bardzo dynamicznych i interaktywnych aplikacji. 1 Zdarzenie w opisywanym kontekście może to być kliknięcie myszką na przycisk znajdujący się na stronie WWW, bądź najechanie kursorem na element, który posiada przypisaną procedurę obsługi takiej ewentualności. 45

4.4.1 OBIEKTOWE PODEJŚCIE DO STRUKTURY DOKUMENTU HTML - DOM Obiektowość jest bardzo pożądaną cechą nowoczesnych języków programowania. Pozwala ona na traktowanie zmiennych programowych, tak jakby były one swego rodzaju kontenerami logicznie zaprojektowanego układu cech (zwanych zmiennymi wewnętrznymi klasy) wraz z towarzyszącymi nim sposobami wykorzystania, nazywanych metodami. Zatem mówiąc o klasie pewnego obiektu, mamy na myśli zestaw zmiennych, które obiekt przechowuje oraz zestaw metod, które umożliwiają operacje na tych zmiennych. Jak było wspomniane JavaScript jest językiem programowania, który pozwala działać na obiektach DOM i manipulować nimi. Innymi słowy, z racji tego, że budowa DOM jest hierarchiczna (drzewiasta) - możliwe jest przeszukiwanie wgłąb stosując relację rodzic-dziecko celem odnalezienia określonego elementu dokumentu HTML. W przypadku skomplikowanych dokumentów, zawierających wiele zagnieżdżonych elementów (w kontekście HTML są to znaczniki) próba odniesienia się do wybranego z nich wymaga doskonałej wiedzy o strukturze tego dokumentu. Aby lepiej uzmysłowić sobie czym jest obiekt DOM oraz jakie są powiązania i zależności pomiędzy konkretnymi jego składowymi, należy przyjrzeć się rysunkowi 12. 46

Rysunek 12. Hierarchia obiektów DOM źródło: na podstawie [7] Na rysunku 12 zobrazowany jest schemat struktury dokumentu HTML w ujęciu DOM. Elementy w zacieniowanych prostokątach nazywane są obiektami, natomiast elementy w białych prostokątach to zbiory / kolekcje. W kolekcjach zbierane są obiekty danego typu, np. odnośniki, obrazy, arkusze stylów. Czyli zawartość strony WWW napisanej w HTML. JavaScript a obiekty DOM Język JavaScript wyposażony jest w mechanizmy i funkcje pozwalające na odwoływanie się do obiektów znajdujących się w obrębie dokumentu HTML. 47

Aby trafnie odróżnić instrukcje języka JavaScript od obiektów DOM, posłużę się poniższym listingiem kodu:... 1. var divtable = document.getelementsbytagname("div"); 2. alert("znaleziono + divtable.length + elementów <div>.");... Objaśnienia : Kolor niebieski oznacza użycie JavaScriptu, czerwony dotyczy DOM. var divtable = : tworzy zmienną JavaScript o nazwie divtable document.getelementsbytagname("div") : Obiekt document przechowuje wszystko, co znajduje się na stronie HTML- struktura dokumentu HTML w ujęciu DOM przedstawiona została na rysunku 12. DOM definiuje metodę dostępu do elementów dokumentu poprzez wywołanie metody getelementsbytagname na rzecz obiektu document. Pobiera ona do listy węzłów (NodeList, rodzaj specyficznej dla DOM tablicy, która przechowuje węzły) wszystkie znaczniki, które odpowiadają przekazanemu parametrowi (w kolejności występowania w źródle dokumentu). Zatem zmienna divtable staje się teraz listą węzłów elementów div występujących w dokumencie. Poprawnie sformułowany element div powinien posiadać atrybut id będący identyfikatorem w skali dokumentu. ; : średnik kończy instrukcję JavaScript alert() jest metodą DOM, która wyświetla okno dialogowe z przekazanym parametrem łańcuchem znakowym. W tym przypadku jest to napis sklejony z trzech składowych: łańcucha znakowego Znaleziono, własności lenght listy węzłów divtable oraz łańcucha znakowego elementów <div>. Własność lenght zdefiniowana w DOM zwraca liczbę całkowitą będącą ilością węzłów przechowywanych w liście węzłów. 48

Jeśli dokument HTML w którym wywołano powyższy fragment kodu zawierał 5 elementów typu div, wówczas użytkownik ujrzy na ekranie okno dialogowe: Jak udowadnia wyżej opisany przykład, za pomocą JavaScriptu można w klarowny i skuteczny sposób odwoływać się do zawartości dokumentu, pod warunkiem, że nie występują między elementami złożone zależności i zagnieżdżenia. W tym przypadku, należy użyć bardziej złożonych algorytmów. 4.5 ASYNCHRONOUS JAVASCRIPT AND XML AJAX (Asynchronous JavaScript and XML) jest od niedawna używaną nazwą na dwie potężne cechy przeglądarek WWW, które, choć dostępne od lat, były pomijane przez wielu autorów stron, aż do niedawna, gdy na rynku ukazały się takie aplikacje, jak Google Suggest i Google Maps. [14] Dzięki tym cechom można: wysyłać zapytania do serwera bez przeładowywania strony, parsować i pracować z dokumentami XML. 49

Termin AJAX jest akronimem od wyrazów: Asynchroniczny oznaczający sposób przesyłania danych. Użytkownik może korzystać ze strony internetowej która wysyła żądanie pobrania danych bez konieczności jej przeładowywania. JavaScript pochodzi od języka programowania, który implementuje funkcjonalność asynchronicznych zapytań. XML jest formatem przechowywania danych w dokumentach tekstowych. Łącząc ze sobą wyżej wymienione pojęcia w jedną całość, można otrzymać kwintesencję zastosowania AJAX. Jak wynika z rozszyfrowania akronimu AJAX, jest on niczym innym, jak technologią łączącą źródło danych zapisanych w dokumentach XML przy wykorzystaniu asynchronicznej transmisji realizowanej za pomocą odpowiednich obiektów i metod zaimplementowanych w języku JavaScript. Mówienie tutaj o technologii AJAX może być mylące, bowiem AJAX jest połączeniem wszystkich wyżej wymienionych składników. Pomimo XML w nazwie, AJAX niekoniecznie wymaga używania formatu XML do wymiany danych. Poza XML obsługiwane są między innymi takie metody jak zwykły tekst, sformatowany HTML (Formatted HTML) oraz format JSON (JavaScript Object Notation). Faktycznie, programista może się posłużyć dowolnym formatem, przy ograniczeniu, że musi on być możliwy do obsłużenia przez JavaScript. Asynchroniczność technologii AJAX jest cechą, która wprowadza nową jakość w projektowaniu aplikacji internetowych. Dotychczas, wysłanie zapytania do serwera, które powodowało zwrócenie przez niego pewnej porcji danych, wiązało się z koniecznością przeładowania aktualnej strony, celem otrzymania wyników swojego zapytania. Podejście do projektowania usług internetowych specyficzne dla AJAX jest zupełnie odmienne. Użytkownik chcący otrzymać pewne dane z serwera jest obsługiwany asynchronicznie a zarządzaniem transmisją pomiędzy nim a serwerem zajmuje się silnik AJAX [14]. 50

Rysunek 13. Synchroniczna i asynchroniczna aplikacja internetowa źródło: opracowane na podstawie [14] W klasycznym ujęciu synchronicznej aplikacji internetowej JavaScript posługuje się metodami GET/POST1 celem pobrania/wysłania nowych danych z/do serwera i ich prezentacji. To podejście, choć pożądane w pewnych sytuacjach (np. tworzenie systemu logowania), posiada pewną wadę : wymusza przeładowanie 1 GET/POST metody działań na wskazanym zasobie,w tym kontekście dotyczą one żądania pobrania/wysłania dokumentu właściwych dla protokołu HTTP. 51

całej strony lub ramki znajduje się pobierająca dane część kodu celem odświeżenia zawartości. Najważniejszym argumentem przemawiającym za korzystaniem z AJAX jest możliwość uzyskania wysokiego poziomu interaktywności w aplikacjach internetowych. Aplikacje internetowe zaprojektowane z wykorzystaniem technologii AJAX są nowoczesne, atrakcyjne dla użytkownika oraz szybkie, gdyż ograniczana jest ilość pobieranych przez klienta danych do tych, które faktycznie są jemu potrzebne - z serwera pobierane są zatem tylko te dane, których żąda użytkownik lub które są niezbędne. Pozwala to na zaoszczędzenie przepustowości łącz. Korzystanie z aplikacji opartej na AJAX przypomina pracę z tradycyjną aplikacją stacjonarną. Jest to bardzo pożądana cecha, ponieważ większość ludzi przyzwyczajonych jest do pracy z takimi właśnie programami. AJAX można również zdefiniować jako metodę wykorzystania JavaScriptu do komunikacji z serwerem niezależnie od tradycyjnych żądań GET i POST. Z technicznego punktu widzenia, podstawą pracy AJAX-a jest obiekt implementujący odpowiednie metody obsługi wykonywania zapytań i pobierania XML-a ze zdalnego serwera. Obiekt ten przyjął nazwę XMLHttpRequest. Bez jego obecności nie byłoby możliwe korzystanie z dobrodziejstw AJAX. Steven Holzner, autor książki Ajax Bible napisał: It s not just JavaScript that makes Ajax tick, it s the XMLHttpRequest object inside JavaScript. [11]. (To nie tylko sam JavaScript pozwala działać Ajax-owi. Robi to obiekt XMLHttpRequest należący do JavaScript-u.) XMLHttpRequest jest wyspecjalizowanym obiektem wbudowanym w język JavaScript nowoczesnych przeglądarek internetowych, którego fizyczna implementacja zależy od konkretnej przeglądarki. Dla przeglądarek Firefox oraz Safari jest on wewnętrznym obiektem JavaScript-u, natomiast dla Internet Explorer-a jest on wbudowanym obiektem ActiveX. W obydwu przypadkach jego funkcjonalność jest jednak taka sama. Ponieważ obiekt XMLHttpRequest różni się pomiędzy 52

przeglądarkami szczegółami implementacji, programista tworzący wykorzystujący go kod musi pamiętać żeby sprawdzić z którą implementacją ma do czynienia i zastosować odpowiednią procedurę obsłużenia każdego z przypadków użycia Listing 4. 1 function loadxmldocument(url) 2 { 3 // Firefox, Opera, Safari 4 if (window.xmlhttprequest) { 5 xmlreguestobject = new XMLHttpRequest(); 6 xmlreguestobject.open("get", url, true); 7. 8. 9 } 10 // Windows' Internet Explorer 11 } else if (window.activexobject) { 12 xmlreguestobject = new ActiveXObject("Microsoft.XMLHTTP"); 13 xmlreguestobject.open("get", url, true); 14. 15. 16 } 17} Listing 4. Dodawanie obsługi AJAX w zależności od wykorzystywanej przeglądarki internetowej źródło: opracowanie własne Fragment kodu z Listingu 4 ma za zadanie sprawdzić z jakiej przeglądarki korzysta klient (linie 4, 11), stworzyć odpowiadający dla każdej z nich obiekt (linie 5, 12) oraz wysłać żądanie o dokument url metodą GET (linie 6, 13). Pomimo różnic w nazewnictwie (XMLHttpRequest dla przeglądarek Firefox, Opera, Safari; Microsoft.XMLHTTP jako obiekt ActiveX dla Internet Explorer), funkcjonalności obiektów w obydwu przypadkach są identczne. Dla porządku będę posługiwał się nazwą XMLHttpRequest. XMLHttpRequest udostępnia API pozwalające wysyłać do serwera żądania HTTP metodami GET oraz POST. Są to te same metody jak w przypadku klasycznej (synchronicznej) aplikacji internetowejj (rysunek 13), z tą różnicą, że ich obsługą w przypadku AJAX-a zajmują się specjalne funkcje stowarzyszone z XMLHttpRequest. Z punktu widzenia serwera, są to zwyczajne zapytania od przeglądarki. Od strony JavaScript-u, XMLHttpRequest udostępnia treść oraz nagłówki wysyłanych komunikatów, przez co programista może na bieżąco 53

sprawdzać i informować użytkownika o postępie połączenia. Przekazaną przez serwer w odpowiedzi na żądanie klienckie treść można odebrać jako zwykły tekst (typ mime text/plain) lub dokument XML (typ mime text/xml). Najczęściej wykorzystywany jest model XML. Nie stoi jednak nic na przeszkodzie, aby odbieraną treść traktować jak zwykły tekst, trzeba jednak pamiętać aby jego format dawał się przetworzyć na poziomie JavaScript-u. responseasxml = xmlreguestobject.responsexml; responseastext = xmlreguestobject.responsetext; W dwóch powyższych 1-linijkowych fragmentach kodu przedstawione zostały metody uzyskania odpowiedzi serwera na zapytanie klienta. Zmienna responseasxml zawiera dokument w formacie XML, zmienna responseastext zawiera dokument w formacie tekstowym. Dalszym przetwarzaniem danych zawartych w tych dwóch zmiennych może zajmować się JavaScript. W zależności od struktury zwróconego dokumentu, programista projektuje odpowiednie procedury jego przetwarzania i decyduje o jego przeznaczeniu. 4.6 APPLICATION PROGRAMMING INTERFACE Google Maps to jeden z serwisów oferowanych przez firmę Google. Jest on bazą danych map oraz zdjęć satelitarnych i lotniczych pochodzących z całego świata. Zdjęcia można oglądać na stronie internetowej w różnych skalach, przy czym maksymalne przybliżenie dostępne jest w wybranych, największych miastach globu rysunek 14. Użytkownik posiada również możliwość przesuwania mapy we wszystkich kierunkach. 54

Rysunek 14. Zamek Wawelski w Krakowie oglądany na mapie Google źródło: opracowanie własne Mapy Google można oglądać zarówno na stronie internetowej producenta www.maps.google.com, jak również możliwe jest projektowanie własnych witryn WWW wyposażonych w funkcjonalność i interfejs użytkownika wzorowaną na oryginale. Google Maps API to interfejs programowania aplikacji dostarczony przez firmę Google, który umożliwia wstawienie mapy na własną stronę internetową. API umożliwia zintegrowanie ze stroną internetową w pełni fukcjonalnej mapy, z naniesionymi na nią własnymi danymi oraz funkcjami przeznaczonymi do obsługi zdarzeń. Wszystkie czynności związane z mapami Google i Google API realizowane są przy użyciu języka JavaScript. Korzystanie z Google Maps API uwarunkowane jest dołączeniem do kodu strony WWW na której ma być umieszczona mapa Google pliku skryptu źródłowego JavaScript, dostarczanego przez firmę Google. Plik ten posiada w swojej nazwie 55

identyfikator, tzw. Google Maps API key, który można uzyskać rejestrując się w portalu Google [9]. Poprzez dołączenie ww. skryptu źródłowego, developer1 uzyskuje dostęp do bibliotek programistycznych dostarczanych przez Google Maps API. Biblioteki te zaimplementowane są w języku JavaScript i obejmują narzędzia pozwalające na [9]: Uwaga wstępna: kolorem czerwonym zaznaczone są fragmenty kodu specyficzne dla Google Maps Api, niebieskim natomiast JavaScriptu. 1. Utworzenie i umieszczenie mapy Google na stronie WWW. var map = new GMap2(document.getElementById("map")); W powyższej linii kodu tworzony jest obiekt JavaScript o nazwie map, który reprezentuje mapę. Argument konstruktora2 stanowi obiekt DOM o identyfikatorze "map". 2. Wycentrowanie utworzonej mapy, poprzez określenie punktu startowego map.setcenter(new GlatLng(19.9352073936, 50.0538526648), 17); Jest to zabieg konieczny do właściwego funkcjonowania mapy stworzonej w punkcie nr 1. Efekt osiągany jest poprzez wywołanie na rzecz obiektu map przyjmującej dwa argumenty. Pierwszym z nich jest obiekt typu setcenter GlatLng metody reprezentujący położenie geograficzne punktu, drugim jest liczba oznaczająca przybliżenie 50.053859826648 to mapy. odpowiednio Liczby 19.935207366936 długość i szerokość oraz geograficzna. W przykładzie środek mapy wskazuje na zamek królewski na Wawelu w Krakowie. 1 developer człowiek rozwijający pewną dziedzinę, w tym kontekście programista 2 konstruktor w kontekście programowania obiektowego, konstruktor to specjalna metoda wywoływana w celu utworzenia obiektu 56

3. Utworzenie i umieszczenie na istniejącej mapie punktów (markerów). 1 2 3 4 var markermanager = new GmarkerManager(map); var marker = new Gmarker(point, icon); markermanager.addmarker(marker); markermanager.refresh(); Powyższe cztery linie kodu odnoszą się do obiektów stworzonych w punktach 1. oraz 2. Obrazują w jaki sposób stworzyć zarządcę markerów (linia nr 1) oraz marker (linia nr 2). Zarządca markerów - GmarkerManager posiada bardzo korzystną cechę, potrafi on nadać każdemu markerowi właściwość poziom przybliżenia, po przekroczeniu którego będzie on widzialny na mapie. Jest to bardzo pomocne w przypadku umiejscawiania bardzo dużej (300 i więcej) ilości markerów, bo pozwala pokazywać jedynie te, które mają poziom przybliżenia większy lub równy aktualnemu mapy. Do utworzenia markera potrzebne są dwie informacje: argument point niosący informację o jego położeniu geograficznym oraz icon będący graficznym znacznikiem reprezentującym go na mapie. Argument point może być obiektem typu GlatLng opisanym powyżej. Icon tworzony jest za pomocą konstruktora GIcon. Aby marker został naniesiony na mapę, należy go umieścić w zarządcy metodą addmarker a następnie zaktualizować zarządcę metodą refresh (linia nr 4). Przedstawione w niniejszym rozdziale klasy, obiekty i metody należące do Google Maps API są zestawieniem interesującym z punktu widzenia projektu GMAP. Opis dedykowanych dla GMAP rozwiązań opisany jest w rozdziale 5.4. 57

5. PROJEKT GMAP MVT IMPLEMENTACJA 58

Zaprojektowany system GMAP ma na celu dostarczenie użytkownikowi programiście konfigurowalnego zestawu narzędzi potrzebnych do wizualizacji wielkości meteorologicznych na mapie Google. System wykorzystuje meteorologiczną bazę danych (rozdziały 5.1 oraz 4.1), pobierane z niej informacje stanowią po dalszym ich przetworzeniu podstawę treści wizualizowanych przez użytkownika. Podczas projektowania systemu GMAP staram się wykorzystywać najnowsze i szeroko dostępne technologie, mając na uwadze atrakcyjność końcowego produktu. Projektowany system z założenia ma pozwalać na odczyt aktualnych danych meteo z bazy danych i przygotowanie narzędzi programistycznych umożliwiających umieszczenie tych danych na mapie. Przetwarzanie informacji pobranych z bazy danych przebiega dwustopniowo. W pierwszym kroku są one pobierane z bazy danych oraz konwertowane do postaci dokumentów XML przy użyciu skryptów napisanych w języku PHP (rozdział 5.2). Dokumenty w formacie XML stanową punkt wyjścia do osiągnięcia celu, jakim jest przedstawienie danych w postaci zmiennych języka JavaScript. Mechanizm, odpowiedzialny za konwersję danych z XML do JavaScript opiera się na wykorzystaniu technologii AJAX służącemu do pobrania XML oraz autorskiego zestawu narzędzi JavaScript, które odpowiadają za poprawne jego przetworzenie (rozdział 5.3). Przygotowane w ten sposób gotowe do wykorzystania zmienne JavaScript stanowią komplet danych potrzebnych do umieszczenia ich na mapie Google (rozdział 5.4) przez użytkownika systemu GMAP. Od użytkownika wymaga się wyłącznie sprecyzowania parametrów pracy GMAP. Schemat ideowy systemu GMAP przedstawiony został na rysunku 15. 59

Rysunek 15. Schemat ideowy systemu GMAP MVT (niebieskie strzałki wyznaczają kierunek przepływu danych, przerywane strzałki wskazują na miejsca ingerencji użytkownika w system) źródło: opracowanie własne Objaśnienia do rysunku 15: Kolorem niebieskim (strzałki oraz podpisy pod nimi) zaznaczony jest kierunek przepływu danych oraz narzędzia, za pomocą których stworzone zostały podsystemy realizujące go. Zobrazowany na środku rysunku 15 symbol dokumentu XML stanowi formę przejściową danych pomiędzy miejscem ich pobrania bazą danych a celem wizualizacją na mapie Google. Strzałki przerywane wskazują na miejsca wpływu użytkownika na działający system. Do podsystemów tworzących GMAP zalicza się: baza danych meteorologicznych, parametryzowalne skrypty napisane w języku PHP, dokumenty XML tworzone w trakcie pracy systemu, autorskie narzędzia napisane w języku JavaScript wykorzystujące technologię AJAX, szablon narzędzi służących wizualizacji danych na mapie Google (konfiguracja wizualizacji) 60

5.1 BAZA DANYCH Zaprojektowanie wydajnego i skalowalnego sposobu przechowywania danych jest kluczowym problemem, który należy rozwiązać podczas projektowania wysoko dostępnych systemów działających w czasie rzeczywistym. O tym jak ważny jest krótki czas reakcji oraz dostępność w przypadku systemu osłony meteorologicznej nie trzeba przekonywać. System osłony meteo, aby móc spełniać swoją rolę musi posiadać możliwość archiwizacji danych (niejednokrotnie ogromnych ich ilości) celem analizy bądź prognozowania zmieniających się warunków atmosferycznych na podstawie dostępnych w systemie informacji. Użycie specjalnie zaprojektowanej bazy jest bardzo rozsądnym sposobem na gromadzenie danych, spełniającym wyżej postawione warunki. Opis wykorzystywanej na potrzeby systemu GMAP bazy danych (tabel, pól, relacji) oraz ich znaczeń znajduje się w rozdziale 4.1. Projektowanie tabel bazodanowych, dobór typów pól w tabelach, wyznaczanie relacji pomiędzy tabelami wykracza poza ramy opisu systemu i korzysta z gotowego rozwiązania w postaci meteorologicznej bazy danych firmy Trax Elektronik. Wszystkie istotne kwestie związane z implementacją systemu zawarte zostały w rozdziale 4.1. 5.2 FORMAT XML ZAŁOŻENIA I IMPLEMENTACJA Aby możliwe było naniesienie informacji na mapę Google konieczne jest wstepne przetransformowanie ich z postaci pobranej z meteorologicznej bazy danych do formatu XML. 61

Wykorzystanie standardu XML jako sposobu do zapisu i udostępniania danych jest powszechne i szeroko stosowane. Istnieje szereg systemów wykorzystujących go zarówno jako źródła danych, jak również zapisujących je w tym standardzie. Do takich systemów należy również system GMAP, który w swej pierwszej fazie implementacji tworzy pliki w formacie XML, aby następnie wykorzystać je jako źródło danych. Wybór formatu XML jako swoistego rodzaju łącznika między bazą danych, a mapą Google jest uzasadniony, gdyż w miarę wzrostu liczby usług wykorzystujących standard XML, staje się on coraz bardziej rozpoznawalny, a co za tym idzie rośnie liczba ludzi wykorzystujących go na co dzień i projektujących różnego rodzaju oparte na nim usługi. Sprawia to, że system GMAP jest system otwartym dla większej rzeszy programistów, co daje mu szanse rozwoju. W kolejnych podrozdziałach opisany został przyjęty w systemie GMAP format danych XML (rozdział 5.2.1) oraz implementacja pozwalająca na przetransformowanie danych z bazy możliwa dzięki skryptom PHP (rozdział 5.2.2). Wykorzystanie stworzonych dokumentów XML jako źródła danych opisane zostało w rozdziale 5.3. 5.2.1 ŹRÓDŁO I ZASTOSOWANY FORMAT DANYCH W systemie GMAP dane zapisywane w formacie XML pozyskiwane są z meteorologicznej bazy danych. Zawiera ona informacje o położeniu stacji pomiarowych a więc o długości i szerokości geograficznej. Wszystkie punkty pomiaru zlokalizowane są w obrębie granic Polski, zatem nie jest potrzebna informacja o półkuli na której znajdują się interesujące nas obiekty. Każda stacja oprócz informacji o położeniu, posiada skojarzone z nią rodzaje prowadzonych pomiarów oraz ich wielkości i wartości. 62

Umieszczane w dokumentach XML tworzonych na potrzeby systemu GMAP wielkości meteorologiczne to: temperatura powietrza na powierzchni ziemi [ ], temperatura powietrza na wysokości 20cm [ ], temperatura powietrza na wysokości 50cm [ ], temperatura powietrza na wysokości 2m [ ], wysokość opadu atmosferycznego z okresu 10 minut [mm], kierunek wiatru, podany w stopniach [ᵒ] licząc od kierunku północnego, poruszając się zgodnie ze wskazówkami zegara, prędkość wiatru [m/s] Stacje pomiarowe różnią się między sobą typem, zatem zestaw mierzonych przez nie wielkości jest różny dla poszczególnych punktów pomiarowych. Oprócz wyżej wymienionych wielkości specyficznych dla systemu meteorologicznego, dokumenty XML zawierają również informację o nazwie stacji, jej lokalizacji i zarządcy któremu podlega dany punkt. Dodatkową informacją zapisaną w XML jest wspomniana wcześniej obecność punktów kamerowych. Podgląd lokalizacji stacji pomiarowej na podstawie zdjęć jest bardzo przydatny z punktu widzenia użytkownika przeprowadzającego wizualizację przy pomocy GMAP. Pomaga to w błyskawicznej ocenie analizy sytuacji meteorologicznej. System GMAP zakłada również uwzględnienie podziału terytorium Polski na rejony. Przewiduje on możliwość generowania dokumentów XML zawierających informacje jedynie o tych stacjach, które należą do wybranych rejonów. W przypadku, gdy w danym rejonie umieszczony jest punkt kamerowy1, informacja ta również uwzględniana jest przy tworzeniu dokumentów XML. 1 punkt kamerowy urządzenie lub grupa urządzeń rejestrująca nieruchomy obraz. 63

Tworzone w systemie dokumenty XML ściśle odwzorowywują zawartość bazy i zawierają wyżej wymienione atrybuty specyficzne dla każdego z punktów pomiarowych. Wpis w dokumentach o każdym punkcie pomiarowym zawiera odpowiednio usystematyzowane pod kątem logicznym elementy. Ich zestaw składa się na indywidualny dla każdego z punktów komplet informacji. Można powiedzieć, że wygenerowany każdorazowo dokument XML jest uporządkowaną listą. Jest to możliwe dzięki wykorzystaniu odpowiednich znaczników. W systemie GMAP przyjęty został format przedstawiony na Listingu 5, stworzony na z uwzględnieniem struktury logicznej wykorzystywanej meteorologicznej bazy danych. <elements> <station id="45"> <station_info> <name>jana Pawła II</name> <maintainer>kraków</maintainer> <longitude>20.0526</longitude> <latitude>50.0685</latitude> </station_info> <cameras>krakow</cameras> <station_measurements pktid="67429455"> <krw>291.2</krw> <prw>0</prw> <opad>0</opad> <T_0>17.4</T_0> <T_2>13.9</T_2> <T_20>14.2</T_20> <wilg>87.1</wilg> </station_measurements> </station> <station id="463"> <station_info> <name>cewice</name> <maintainer>rdlp Gdańsk</maintainer> <longitude>17.73</longitude> <latitude>54.44</latitude> </station_info> <cameras>na</cameras> <station_measurements pktid="67431132"> <krw>48.2</krw> <prw>0</prw> <T_50>0</T_50> 64

<wilg>85.3</wilg> </station_measurements> </station> </elements> Listing 5. Struktura zaprojektowanego dokumentu XML na przykładzie stacji pomiarowych Cewice oraz Jana Pawła II źródło: opracowanie własne Korzeniem tworzonych dokumentów jest znacznik o nazwie elements. W jego obrębie znajdują się wszystkie pozostałe znaczniki. Nazewnictwo większości znaczników jest anglojęzyczne. Cały dokument mógłby zawierać tylko i wyłącznie polskie wyrazy, jednakże każdemu projektantowi zależy na tym, aby jego praca była jak najbardziej przejrzysta i dostępna dla szerokiego grona odbiorców, również użytkowników zagranicznych. Bez tłumaczenia na nazwy angielskie pozostawiono elementy opisujące rodzaje mierzonych wielkości. Ma to na celu zachowanie precyzyjnej informacji o rodzaju pomiaru przeprowadzanego przez czujnik określonego typu. Elementem języka XML rozpoczynającym opis punktu pomiarowego jest znacznik <station>. Posiada on jeden atrybut o nazwie id. Atrybut ten jest unikalny dla każdej ze stacji i pozwala na jej identyfikację w systemie bazodanowym. Więcej na temat struktury bazy danych wykorzystywanej przez GMAP można znaleźć w rozdziale który szczegółowo ją opisuje rozdział 4.1.1 Informacje nie związane z meteorologią zostały oddzielone od meteorologicznych celem uzyskania większej przejrzystości zaprojektowanego dokumentu - rysunek 16. 65

Rysunek 16. Schemat hierarchii oraz podziału elementów w zaprojektowanym dokumencie XML źródło: opracowanie własne Elementy znajdujące się pomiędzy znacznikami <station> </station> należy interpretować jako treść opisu danego punktu pomiarowego oraz odpowiadające mu mierzone wielkości i ich wartości. Opis znaczników wykorzystywanych w GMAP station_info - jest to subelement względem station. Zawiera on nie związane z meteorologią informacje o danym punkcie pomiarowym takie jak: name nazwa punktu pomiarowego, zapis tekstowy, maintaner w wolnym tłumaczeniu 'zarządca', niekiedy oznacza region do kórego punkt przynależy, zapis tekstowy, longitude długość geograficzna wschodnia wielkość liczbowa, latitude szerokość geograficzna północna wielkość liczbowa. cameras subelement względem station, niesie informacje o nazwie kartoteki w której znajdują się aktualne obrazy kamerowe z danego punktu pomiarowego wyposażonego kamerę, zapis tekstowy, station_measurements subelement względem station. Zawiera 66

informacje meteorologiczne do których należą: krw kierunek wiatru, wielkość wyrażona w stopniach, liczona od kierunku północnego poruszając się zgodnie ze wskazówkami zegara, prw prędkość wiatru, wielkość wyrażona w metrach na sekundę, T_0 temperatura nawierzchni/temperatura powietrza na wysokości 0 cm mierzona w stopniach Celsjusza T_20 temperatua powietrza na wysokości 20 cm, mierzona w stopniach Celsjusza T_50 temperatua powietrza na wysokości 50 cm, mierzona w stopniach Celsjusza T_2 temperatua powietrza na wysokości 2 m, mierzona w stopniach Celsjusza Opad wartość pomiaru wysokości opadu atmosferycznego z okresu 10 minut podawana w mm Wilg wilgotność względna, podana w procentach Struktura oraz rodzaj danych zapisanych w dokumencie XML pozwalają użytkownikowi na prostą i jednoznaczną interpretację. Dodatkowe zapisy takie jak długość oraz szerokość geograficzna czynią z dokumentów solidną i wystarczającą podstawę do umieszczenia danych w nich zapisanych na mapie Google. Struktura dokumentów XML została zorganizowana w sposób przejrzysty i zgodny z zasadami ich tworzenia [por rozdział 4.3.1]. Sposób jej tworzenia opisany został w rozdziale 5.2.2. 67

5.2.2. TWORZENIE DOKUMENTÓW XML PRZEZ SKRYPTY PHP PERSONALIZACJA I PARAMETRYZACJA Zaprojektowane na potrzeby systemu GMAP dokumenty XML generowane są w sposób dynamiczny za pośrednictwem języka PHP na podstawie danych pobranych z rzeczywistej bazy meteorologicznej [por rozdział 4.3.1]. Język PHP jest wykorzystywany tam, gdzie wymagana jest potrzeba tworzenia dokumentów z dynamicznie generowaną zawartością, w skład których wchodzą również te, których treść oparta jest na zawartości bazy danych. W systemie GMAP generowane dokumenty XML są konfigurowalne przez użytkownika. Posiada on możliwość wyboru lokalizacji i rodzajów pomiarów. Opis tego zagadnienia znajduje się w dalszej części pracy. Po określeniu parametrów wywołania skryptu uruchamiany jest mechanizm odpowiedzialny za pobieranie rekordów z bazy. Jest to realizowane poprzez wykorzystanie odpowiednich bibliotek i funkcji udostępnianych przez język PHP opisanych w niniejszym rozdziale. Personalizacja Użytkownik posiada możliwość edycji parametrów pracy systemu poprzez wybór zakresu lokalizacji (rejony) oraz pomiarów których użyje do swojej wizualizacji za pośrednictwem GMAP. Swoboda w powyższych kwestiach czyni GMAP uniwersalnym systemem przystosowanym do różnych zastosowań i wymagań użytkownika. Wybór zakresu rejonów oraz pomiarów sprowadza się do modyfikacji odpowiedniego skryptu PHP - getxml.php. Skrypt ten generuje dokumenty XML wymagane przez pozostałe komponenty GMAP. 68

Rejony Zaprojektowany system umożliwia użytkownikowi wybór zakresu stacji meteorologicznych przeznaczonych do wizualizacji. Sposób oraz szczegóły implementacyjne wizualizacji leżą w gestii użytkownika, ponieważ GMAP ma za zadanie jedynie dostarczyć narzędzia, które to zadanie umożliwią. Przyjęto, że najmniejszą jednostką, którą wykorzystuje silnik GMAP jest rejon. Wybór rejonu determinuje listę należących do niego stacji meteo i punktów kamerowych. Zatem decyzja mająca wpływ na końcową ilość i rozmieszczenie wizualizowanych obiektów podejmowana jest przez użytkownika na samym początku. Rejon utożsamiany jest w kontekście niniejszej pracy z jego zarządcą. Dla przykładu: rejon o nazwie g_krakow podlega pod zarządcę GDDKiA (Generalna Dyrekcja Dróg Krajowych i Autostrad) Kraków. Z kolei rejon krakow podlega zarządowi dróg miasta Kraków. Nic nie stoi na przeszkodzie, aby użytkownik wykorzystywał do swojej wizualizacji kilka, bądź kilkanaście rejonów jednocześnie, ma w tej kwestii pełną swobodę wyboru. Wybór rejonów przez użytkownika odbywa się za pośrednictwem zmodyfikowania ich listy. Pomiary Stacje meteo różnią się między sobą ilością i rodzajem zainstalowanych czujników pomiarowych. Można spotkać się ze stacjami mierzącymi wyłącznie kierunek oraz siłę wiatru, są również takie, które oprócz parametrów wiatrowych zbierają również dane o temperaturze, wilgotności oraz intensywności opadu. Z uwagi na różnorodność stacji meteo, GMAP udostępnia użytkownikowi możliwość wyboru rodzajów pomiarów przeznaczonych do wizualizacji. Wybór pewnego 69

zakresu pomiarów odnosi się do wszystkich stacji meteo przynależących do wybranych wcześniej przez użytkownika rejonów. Punkty kamerowe GMAP wyposażony jest w mechanizm sprawdzania, czy dana stacja meteorologiczna wyposażona jest w kamerę. Dodawanie informacji o punkcie kamerowym realizowane jest automatycznie na poziomie skryptu getxml.php. W tym miejscu systemu GMAP, użytkownik nie ma wpływu na umieszczanie, czy też nie informacji o punktach kamerowych. Parametryzacja W poprzedniej części niniejszego rozdziału opisany został sposób konfigurowania parametrów skryptu generującego dokumenty XML. Parametry te można podzielić na dwie grupy: parametry konfiguracyjne określające rejon(y) dla których generowane mają być dokumenty XML, parametry konfiguracyjne określające pomiary dla których generowane mają być dokumenty XML. Poniżej opisany jest sposób wykorzystania przez skrypt PHP obu grup parametrów. Implementacja w oparciu o parametry konfiguracyjne określające rejon(y) dla których generowane mają być dokumenty XML. Na listingu 6 przedstawiona jest implemenatcja mechanizmu związanego z obsługą zapytań do bazy danych, uwzględniająca parametry konfiguracyjne określające rejon(y), dla których generowany ma być dokument XML. 70

1 $dbase = new db(); 2 $dbase -> conn($host,$port,$user,$password,$dbname); 3 $result = $dbase -> performquery("select stacje.stid, stacja as nazwa_stacji, rejony.rejnazwa as zarzadca, dlugosc, szerokosc from stacje natural join rejony where rejonid in(3,11,15) order by stid ASC"); Listing 6. Połączenie z bazą danych i wybór rejonów w systemie GMAP MVT źródło: opracowanie własne Objaśnienia: Linia nr 1. - Tworzony jest obiekt $dbase, będący reprezentacją połączenia z bazą danych. Na potrzeby projektu GMAP została napisana specjalna klasa o nazwie db, która obsługuje połączenie z meteorologiczną bazą danych Linia nr 2. Ponadto możliwe jest wykonywanie zapytań do bazy danych za pomocą przynależnej jej metody o nazwie performquery() - linia nr 3. Klasa db posiada mechanizm sprawdzający czas wykonania się zapytania. W przypadku przekroczenia wartości krytycznej (30 sekund) zapytanie jest anulowane, a użytkownik otrzymuje o tym fakcie zwrotną informację. Pod zmienną $result podstawiony zostanie rezultat zapytania SQL zwróconego przez metodę performquery(). Jest nim tabela której format został przedstawiony w tabeli 8. Treścią zapytania jest tekst: select stacje.stid,stacja as nazwa_stacji,rejony.rejnazwa as zarzadca,dlugosc,szerokosc from stacje natural join rejony where rejid in(3,11,15) order by stacje.stid ASC" Z punktu widzenia użytkownika najważniejsze w powyższym zapytaniu są liczby 3,11,15 będące identyfikatorami rejonów zarządców do których przynależą stacje. 71

Proces przebiegu tego zapytania w systemie GMAP odbywa się w sposób przedstawiony na rysunku 17. Rysunek 17. Plan zapytania do bazy danych łączącego tabele stacje i rejony źródło: opracowanie własne Wydobycie z bazy danych listy stacji meteo, przynależących do rejonów o identyfikatorach 3,11,15 odbywa się na zasadzie łączenia ze sobą dwóch tabel: stacje oraz rejony. Kryterium łączenia jest występowanie w kolejnych wierszach tabeli stacje pola rejoinid o wartości będącej liczbą 3,11 lub 15.Łączenie tabel metodą natural join jest możliwe w przypadku występowania w obu łączonych ze sobą tabelach pola o tej samej nazwie i typie. W naszym przypadku tym polem jest rejid. Łączenie tabel stacje i rejony odbywa się przy użyciu specjalnych tabel haszujących (stąd krok Hash Join na planie zapytania). Tabele haszujące rezydują w pamięci i bardzo efektywnie skracają czas wykonywania zapytań dla przykładu zwrócenie 400 wierszy będących wynikiem złączenia tabel stacje i rejony zajęło łącznie 273ms. Ostatnim krokiem na planie zapytania jest posortowanie wyników w sposób rosnący ASC względem pola stid z tabeli stacje. Wykonanie się powyższego zapytania zwraca tabelę danych o formie przedstawionej w tabeli 8. 72

Tabela 8. Przedstawienie wyników zapytania do bazy danych łączącego tabele stacje i rejony źródło: opracowanie własne Widoczne jest w jaki sposób poszczególnym rejonom zarządcom przyporządkowane zostały odpowiadające im stacje meteo. Podsumowując, użytkownik korzystający z GMAP musi dysponować informacją o rejonach i odpowiadających im identyfikatorach rejid. Wiedza ta wystarcza do skonfigurowania GMAP pod kątem doboru zakresu przetwarzanych przez niego stacji meteorologicznych. Implementacja w oparciu o parametry konfiguracyjne określające pomiary dla których generowane mają być dokumenty XML System GMAP obsługuje następujące rodziny pomiarów: temperaturowe T_0, T_20, T_50, T_2 związane z wiatrem: krw, prw wilgotność: 73

wilg opad: opad Objaśnienia rodzajów pomiarów należących do poszczególnych rodzin znajdują się w rozdziale 5.2.1. Użytkownik definiuje je na początku pliku getxml.php poprzez przypisanie do zmiennej $wykorzystywane_pomiary ich listy. Każdy rodzaj pomiaru oddzielany jest on sąsiedniego za pomocą przecinka. Przykład: $wykorzystywane_pomiary = T_0,T_2,krw,prw System GMAP odpowiada za to, żeby każdej stacji meteo należącej do wybranych przez użytkownika rejonów (Personalizacja) przyporządkowane zostały odpowiadające jej rodzaje pomiarów. W przypadku, jeśli pewna stacja meteo nie prowadzi jakiegoś z typów pomiaru, wówczas nie zostanie on w ogóle uwzględniony w generowanych dokumentach XML. Reasumując, od użytkownika GMAP wymaga się jedynie określenia listy rejonów oraz listy pomiarów. Stanowią one dane wejściowe dla skryptu getxml.php. Tworzenie dokumentów XML odbywa się w oparciu o dane pobierane z bazy danych i można je podzielić na kilka stadiów rysunek 18. Poszczególne stadia są od siebie uzależnione, dlatego więc dokumenty XML generowane są w ściśle określony sposób: Poniższe punkty dotyczą schematu generowania dokumentów XML stanowiąc jego opis. Następujące po sobie stadia oznaczone zostały na rysunku 18 liczbami znajdującymi się w szarych kółkach. Wstępem do pracy jest przygotowanie zakresu danych wejściowych (wybór rejonów, wybór pomiarów). Po tej operacji kolejno następują: 74

1. Przyporządkowanie stacji do rejonów wynik: stworzenie listy stid, zawiera ona zbiór informacji o przyporządkowanych stacjach, 2. Przyporządkowanie poszczególnym stacjom meteorologicznym na liście stid przesłanych przez nie najnowszych nie starszych niż 10 minut pakietów, wynik: lista stid z powiązanymi identyfikatorami pakietów pktid 3. Wyodrębnienie zdefiniowanych przez użytkownika pomiarów wynik: lista stid z powiązanymi identyfikatorami pakietów pktid z uwzględnieniem wybranych przez użytkownika pomiarów 4. Dodanie do struktury opisanej w pkt. 3 informacji związanej z rodzajami wielkości reprezentowanymi przez pomiary wynik:lista stid z powiązanymi identyfikatorami pakietów pktid z uwzględnieniem wybranych przez użytkownika pomiarów. Pomiary mają nadane im wielkości. 5. Uzupełnienie struktury informacją o występowaniu punktu kamerowego przypisanego do danej stacji meteo. Wynik: komplet informacji potrzebnej do generowania dokumentów XML 6. Generowanie dokumentów XML. 75

Rysunek 18. Schemat generowania dokumentów XML w systemie GMAP MVT źródło: opracowanie własne W wyniku wykorzystania na potrzeby GMAP języka PHP jako interfejsu do łączenia się z bazą danych oraz wykonywania na niej zapytań uwzględniających konfigurację określoną przez użytkownika otrzymano poprawne i w pełni wartościowe dokumenty XML. 5.3 W KIERUNKU JAVASCRIPT W POŁĄCZENIU Z AJAX Wygenerowanie dokumentów w formacie XML zawierających dane dotyczące stacji meteorologicznych (rozdział 5.2) stanowi punkt wyjścia dla podsystemu 76

należącego do GMAP, który zajmuje się ich konwersją do zmiennych języka JavaScript. JavaScript jest jedynym językiem programowania, który może zostać wykorzystany do wizualizacji obiektów na mapie Google. Pracę tego podsystemu można podzielić na dwa etapy: 1. pobranie zawartości dokumentu XML, zaimplementowane jest ono z wykorzystaniem technologii AJAX, 2. przetworzenie pobranej zawartości za pośrednictwem autorskiego zestawu narzędzi JavaScirpt Etap nr 1. obejmuje obsługę żądania pobrania dokumentu XML z serwera, następnie importuje go, Etap nr 2. obejmuje wykonanie konwersji wejściowego pobranego przy wykorzystaniu technologii AJAX dokumentu XML do zmiennych języka JavaScript. 5.3.1 IMPORT XML Pobieranie zawartości utworzonych przez system GMAP dokumentów w formacie XML odbywa się na poziomie języka JavaScript za pośrednictwem funkcji loadxmldocument(url). Przyjmuje ona jeden argument, jest nim tekst w formacie URL1. Funkcja ta została zaprojektowana w sposób który umożliwia identyfikację przeglądarki z której korzysta użytkownik i stworzenie odpowiadającego jej obiektu AJAX. Obiekt ten nosi w systemie GMAP nazwę xmlreguestobject i jest odpowiedzialny za pobranie dokumentu XML z lokalizacji wskazywanej przez url. Opisywana funkcja loadxmldocument(url) ma za zadanie przekonwertować pobrany dokument XML do postaci zmiennej JavaScript, będącej jego nieprzetworzoną reprezentacją. 1 URL - (ang. Uniform Resource Locator) - ujednolicony format zasobów. Służy między innymi do identyfikowania zasobów dostępnych w internecie. 77

Przykładowe użycie funkcji loadxmldocument(url) może mieć postać: sposób nr 1. loadxmldocument("http://www.xml.com/xmldoc.xml"); Wywołanie powyższej linii kodu spowoduje, że system GMAP podejmie próbę połączenia się z adresem internetowym http://www.xml.com/ celem pobrania statycznego dokumentu o nazwie xmldoc.xml. Innym sposobem wywołania opisywanej funkcji jest: sposób nr 2. loadxmldocument("http://www.xml.com/php_xmldoc_generator.php") Przedstawia odmienne podejście w kontekście przechowywania dokumentu XML na serwerze. W odróżnieniu od sposobu nr 1. który zakładał załadowanie statycznego dokumentu, sposób nr 2. obrazuje możliwość pobrania dokumentu XML wygenerowanego w sposób dynamiczny przy użyciu skryptu PHP o nazwie php_xmldoc_generator.php. System GMAP obsługuje obydwa wyżej wymienione sposoby pozyskiwania dokumentów XML. W momencie udanego nawiązania połączenia z serwerem z którego ma zostać pobrany wyznaczony dokument XML, system GMAP rozpoczyna jego pobieranie za pomocą procedur zaimplementowanych przez AJAX. W międzyczasie monitorowany jest postęp tego zadania. Rozróżniane są 3 stany oparte o właściwość obiektu AJAX xmlreguestobject reprezentującego połączenie nawiązane w celu pobrania dokumentu XML. Określają one postęp w imporcie dokumentu: data loading : oznacza on udaną inicjalizację, data partially (available) : oznacza on, że część dokumentu XML została już poprawnie zaimportowana, 78

data ready : oznacza on, że dokument w całości został poprawnie zaimportowany i jest gotowy do wykorzystania. Umieszczenie na stronie WWW użytkownika systemu GMAP pól stanu importu dokumentów XML jest dostępne przy użyciu funkcji JavaScript o nazwie showprogresscells(dom_object). Przyjmuje ona jako argument obiekt typu DOM, przy założeniu że może on zawierać w sobie znacznik języka HTML <div>. 5.3.2 PRZETWARZANIE XML Po poprawnym pobraniu dokumentu, informacja o tym fakcie wraz z nieprzetworzonym dokumentem XML przekazywana jest do funkcji JavaScript należących do autorskiego zestawu narzędzi. Bazuje on na wykorzystaniu nieprzetworzonego dokumentu XML znajdującego się w postaci zmiennej JavaScript. Proces przetwarzania opiera się na rozbiciu całości dokumentu na mniejsze jednostki. Każda z jednostek opisuje jedną stację meteorologiczną i zawiera specyficzne dla niej informacje (położenie geograficzne, nazwa, rejon/zarządca) oraz dane meteorologiczne. Funkcją należącą do autorskiego zestawu narzędzi JavaScript która realizuje dekompozycję dokumentu XML do mniejszych jednostek jest processxmltogm(js_xml_document). Przyjmuje ona jeden argument wejściowy, jest nim nieprzetworzony dokument XML - js_xml_document. Funkcja ta stanowi punkt połączenia pomiędzy systemem GMAP a aplikacją użytkownika, który otrzymuje możliwość wizualizacji na mapie Google punktów będącymi odzwierciedleniem stacji meteorologicznych. Istotę działania oraz domyślny format zapisu jednostek wytwarzanych przez funkcję 79

processxmltogm() przedstawia rysunek 19. Rysunek 19. Konwersja dokumentu XML przez system GMAP MVT do zmiennych JavaScript źródło: opracowanie własne Objaśnienia: Niebieskie strzałki zwrócone są w kierunku jednostek powstałych na bazie danych pochodzących z tabel informacyjnych meteorologicznej bazy danych, czerwone dane meteorologiczne. Opis elementów można znaleźć również w rozdziale 4.1.1. _name_element : zapisane są w niej informacje o nazwie stacji meteorologicznej, _maintainer_element : zapisane są w niej informacje o rejonie/zarządcy stacji meteorologicznej, _longitude_element : zawiera liczbę będącą wartością długości geograficznej stacji meteorologicznej, _latitude_element : zawiera liczbę będącą wartością szerokości geograficznej stacji meteorologicznej, var_camdir : przechowywuje informację o przynależności do stacji punktu kamerowego, 80

var_station_measurements : przechowuje listę złożoną z rodzajów pomiarów i odpowiadających im wartości. Format listy jest następujący: rodzaj_pomiaru_1:wartość_1,rodzaj_pomiaru_2:wartość_2,... przykład: T_20:15.7,opad:2,krw:234.1,prw:1.8 Znaki dwukropka : oddzielają rodzaj pomiaru od jego wartości, przecinki, dzielą następujące po sobie pary rodzaj_pomiaru:wartość. Każdy zestaw jednostek:_name_element, _maintainer_element, _longitude_element, _latitude_element, var_camdir, var_station_measurements stanowi opis pojedynczej stacji meteorologicznej. System GMAP umożliwia użytkownikowi ingerencję w nazewnictwo jednostek oraz format listy rodzajów pomiarów i odpowiadających im wartości. Odbywa się to poprzez przedefiniowanie ciała funkcji processxmltogm(). Zmiana nazw zmiennych polega na zastąpieniu w kodzie funkcji starych (domyślnych) na nowe. Zmiana formatu listy ogranicza się do skorygowania separatorów ; oraz,. Nie zaleca się zmiany rodzaju pomiaru, gdyż niesie on ze sobą informację o wykorzystywanym przez daną stację meteorologiczną rodzaju czujnika. Podsumowując, dzięki wykorzystaniu technologii AJAX do pobierania dokumentów XML oraz stworzonemu autorskiemu zestawowi narzędzi, który przetwarza je do postaci jednostkowych użytkownik GMAP otrzymuje dane w formie która umożliwia umieszczenie ich na mapie Google. Sposób implementacji aplikacji użytkownika ma wpływ na końcowy efekt przeprowadzanej wizualizacji, gdyż zarówno GMAP jak i Google Maps API są konfigurowywalne. 81

5.4 PREZENTACJA DZIAŁANIA SYSTEMU GMAP MVT System GMAP MVT jest zbiorem narzędzi służących do wizualizacji wielkości meteorologicznych opartym na Google Maps, Ajax oraz PHP. We wcześniejszych rozdziałach opisane zostały zasady według kórych funkcjonuje GMAP oraz narzędzia programistyczne umożliwiające współpracę użytkownika z systemem. Ostatnim i docelowym komponentem systemu GMAP jest warstwa prezentacji oparta o wizualizację działania systemu na mapie Google. Wizualizacja została zaimplementowana przy wykorzystaniu interfejsu Google Maps API. Do jej obsługi zaprojektowane zintegrowane z GMAP funkcje JavaScript, stanowiące szablon wizualizacyjny dla użytkowników systemu. Każda z opisywanych w niniejszym rodziale funkcji wykorzystujących API Google może być modyfikowana i dostosowywana do potrzeb i wymagań użytkownika. Stacje meteorologiczne symbolizowane są na mapie za pomocą markerów. Po kliknięciu na marker otwiera się okienko informacyjne zawierające dane dotyczące stacji. Warstwa prezentacji GMAP wykorzystuje do wizualizacji dane przechowywane w zmiennych języka JavaScipt. Sposób ich uzyskania opisany jest w rozdziale 5.3.2. Mechanizm wizualizacji w systemie GMAP wykorzystujący Google Maps API można podzielić na następujące etapy: 1. Utworzenie mapy Google i umieszczenie jej na stronie WWW, 2. stworzenie specjalnego obiektu Google Maps API o typie GMarkerManager, będącego zarządcą umieszczanych na mapie danych, 3. przygotowanie i utworzenie markerów, 4. wyświetlenie markerów. Szczegółowy opis każdego z etapów znajduje się w dalszej części pracy. 82

1. Utworzenie mapy Google i umieszczenie jej na stronie WWW. Mapa Google umieszczona jest wewnątrz znacznika <div>1 dokumentu HTML. Wymaganym jest zdefiniowanie atrybutu id będącym jego unikalnym identyfikatorem w obrębie dokumentu oraz wymiarów tego znacznika tj. jego szerokości oraz wysokości podawanej w pikselach bądź procentowo w odniesieniu do rozdzielczości ekranu. Tworzona mapa ma wielkość taką samą jak znacznik <div> w której się znajduje. Wykorzystana do przeprowadzenia prezentacji systemu mapa ma wymiary: szerokość: 80% rozdzielczości poziomej ekranu, wysokość: 550 pikseli. Są to wartości dobrane w sposób umożliwiający wygodne korzystanie z mapy w najpopularniejszym zakresie rozdzielczości ekranu podanej w pikselach: 800x600, 1024x768 oraz 1280x1024. Mapę Google umieszczona została w dokumencie HTML w następujący sposób: stworzony został znacznik <div> będący kontenerem dla mapy (język HTML): <div id="map_div" style="width: 80%; height: 550px; > </div> do utworzonego znacznika dodany został obiekt mapy (język JavaScript, Google Maps API): map = new Gmap2(document.getElementById("map_div")); 2. Stworzenie specjalnego obiektu Google Maps API o typie GMarkerManager, będącego zarządcą umieszczanych na mapie danych. Obiekt typu GmarkerManager służy do umieszczania w nim zbioru zbioru markerów. Sposób w jaki jest on tworzony został opisany w rozdziale 4.6. W GMAP obiekt GmarkerManager występuje on pod nazwą markermanager. 1 <div> - znacznik oferujący ogólny mechanizm dodawania struktury do dokumentów, grupuje inne znaczniki. [15] 83

3. Przygotowanie i utworzenie markerów. Przyjęto, że każdy marker odzwierciedla na mapie Google dokładnie jedną stację meteorologiczną. Marker składa się z ikony oraz okienka informacyjnego. Rola okienka informacyjnego polega na wyświetleniu dodatkowych treści w oknie mapy. Odbywa się to poprzez kliknięcie lewym przyciskiem myszy na ikonę markera znajdujacego się na mapie. W kontekście konfiguracji pojedyńczego markera system GMAP umożliwia użytkownikowi: 1. Utworzenie markera. Za tworzenie markera w systemie GMAP odpowiedzialna jest funkcja createtabbedmarker(coords,icon,t1t,t1c,t2t,2tc,caminfo) Zwraca ona do systemu GMAP obiekt typu GMarker reprezentujący pojedyńczą stację meteorologiczną. Wywoływana jest ona z następującymi argumentami: coords : współrzędne geograficzne w postaci obiektu typu GLatLng więcej informacji na jego temat można znaleźć w rozdziale 4.6. icon : obiekt typu GIcon, zawierający parametry ikony symbolizującej tworzony marker. Ikona musi być wcześniej utworzona za pomocą funkcji seticonappearance() opisanej w dalszej części pracy. t1t : tytuł zakładki nr. 1 w okienku informacyjnym, t1c : treść zawartości okienka informacyjnego nr 1. t2t : tytuł zakładki nr. 2 w okienku informacyjnym, t2c : treść zawartości okienka informacyjnego nr 2. caminfo : informacja o tym, czy stacja meteorologiczna wyposażona jest w punkt kamerowy. 84

2. Utworzenie ikony. Do utworzenia i zmiany wyglądu ikony w systemie GMAP służy funkcja o nazwie: seticonappearance(imageurl, width, height, anchorx, anchory) Zwraca ona do systemu GMAP obiekt typu GIcon będący reprezentacją ikony. Wywoływana jest ona z argumentami imageurl : adres zasobu URL opisujący ścieżkę dostępu do pliku obrazu ikony. width : szerokość obrazu ikony, podawana w pikselach height : wysokość obrazu ikony, podawana w pikselach anchorx : zakotwiczenie ikony na mapie w poziomie, licząc od jej górnego lewego rogu anchory : zakotwiczenie ikony w pionie na mapie, licząc od jej lewego górnego rogu 3. Zdefiniowanie zawartości okienka informacyjnego. GMAP jest zestawem narzędzi dedykowanym do wizualizacji zjawisk meteorologicznych, zatem na zawartość okienka informacyjnego składają się dane pobrane z meteorologicznej bazy danych, uprzednio odpowiednio przetworzone. Sposób tworzenia tych danych oraz ich reprezentacja zostały szczegółowo opisane w rozdziale 5.3.2. Zawartość okienka informacyjnego definiowana jest we wspomnianej wcześniej funkcji tworzącej marker : createtabbedmarker(). Funkcja ta jest zaprojektowana w sposób pozwalający na intuicyjne wpływanie na wygląd i zawartość okienka informacyjnego, wymaga ono zgodności treści w nim umieszczanych z językiem HTML. 85

Wywołanie funkcji createtabbedmarker(): createtabbedmarker( new GlatLng(_longitude_element,_latitude_element), 'info', _name_element, 'pomiary', var_station_measurements, var_camdir) Za odpowiednie argumenty funkcji podstawione zostają dane odpowiadające jednej stacji meteorologicznej. Ich format oraz znaczenia wyjaśnione są w rozdziale 5.3.2.Zakładki okienka informacyjnego przyjęły nazwy odpowiednio info oraz pomiary. Treścią zakładki info jest nazwa stacji, natomiast treścią zakładki pomiary jest lista przejrzyście sformatowanych przez funkcję rodzajów pomiarów i ich wartości. Umieszczona jest również informacja o punkcie kamerowym. Przykładowy wygląd okienka informacyjnego przedstawiony został na rysunku 20. Rysunek 20. Przykładowy wygląd okienka informacyjnego na przykładzie stacji meteorologicznej Dobrodzień źródło: opracowanie własne 86

Kliknięcie myszką na napis obraz kamerowy powoduje otwarcie się w nowym oknie witryny WWW zawierającej obraz zarejestrowany w punkcie kamerowym stacji Dobrodzień rysunek 21. Rysunek 21. Obraz kamerowy, punkt kamerowy Dobrodzień źródło: opracowanie własne 4. Wyświetlenie markerów. Wyświetlanie markerów realizowane jest przy pomocy obiektu typu GMarkerManager. Kolejne markery dodawane są do obiektu markermanager za pomocą metody addmarker. markermanager.addmarker(marker); Po dodaniu ostatniego markera, są one wyświetlane na mapie Google: markermanager.refresh(); 87

System GMAP umożliwia wizualizację bardzo dużej ilości markerków na jednej mapie. Fakt ten czyni go skalowalnym, dając tym samym szerokie możliwości rozwoju [10]. Na rysunku 22 przedstawiona została wizualizacja 256 stacji meteorologicznych należących do systemu fiirmy Trax Elektronik. Rysunek 22. Wizualizacja systemu stacji meteorologicznych przy użyciu systemu GMAP MVT źródło: opracowanie własne 88