Diplomová práce. Lukáš Jelínek. Vedoucí práce: RNDr. Marko Genyk-Berezovskyj

ČESKÉ VYSOKÉ UČENÍ TECHNICKÉ V PRAZE FAKULTA ELEKTROTECHNICKÁ

Diplomová práce

Lukáš Jelínek

Vedoucí práce: RNDr. Marko Genyk-Berezovskyj

Navazující magisterský program: Elektrotechnika a informatika strukturovaný Obor: Výpočetní technika květen 2010

iv

Poděkování Vřele děkuji svým blízkým, kteří mně dodávají duševní sílu a podporují mé snažení. Dále děkuji vedoucímu práce panu RNDr. Markovi Genyk-Berezovskému, jehož zkušené rady mají mnohdy cenu zlata. V neposlední řadě chci vyjádřit dík štěstěně i všem ostatním, kteří přispěli svou troškou do mlýna.

v

vi

Prohlášení Prohlašuji, že jsem svou diplomovou práci vypracoval samostatně a použil jsem pouze podklady uvedené v přiloženém seznamu. Nemám závažný důvod proti užití tohoto školního díla ve smyslu §60 Zákona č.121/2000 Sb., o právu autorském, o právech souvisejících s právem autorským a o změně některých zákonů (autorský zákon)

V Praze dne 13. 5. 2010 ………………………………………………………..

vii

viii

Abstract 3D maps tries to follow the bachelor thesis Height profile generating program and offer a map browser of the Czech Republic. The most important change is the implementation of pure web application without plug-ins. Connections to providers of map layers and elevation data are necessary condition for functionality of the application. After designing or importing routes the height profile of the route can be analyzed by specific tools and by viewing it in the three-dimensional relief of the landscape. The application supports all of the most common coordinate systems for GPS. Usability testing with typical users and detailed analysis are an important part of the work.

Abstrakt 3D mapy se snaží v návaznosti na bakalářskou práci Generátor výškového profilu nabídnout prohlídku map ČR. Nejpodstatnější změnou je implementace čistě webové aplikace bez nutnosti použití zásuvných modulů. Nezbytnou podmínkou funkčnosti je propojení s databázemi poskytovatelů mapových podkladů a výškových dat. Po navržení nebo importu trasy lze analyzovat výškový profil této trasy specifickými nástroji i v prostředí trojrozměrného reliéfu krajiny. Aplikace podporuje všechny nejběžnější souřadnicové systémy pro GPS. Důležitou součástí je testování použitelnosti běžnými uživateli s podrobným rozborem.

ix

x

Obsah SEZNAM OBRÁZKŮ...........................................................................................................................................XV SEZNAM TABULEK...........................................................................................................................................XV 1. ÚVOD....................................................................................................................................................................1 2. SPECIFIKACE CÍLE..........................................................................................................................................3 2.1. 2D MAPA.........................................................................................................................................................3 2.2. 3D MAPA.........................................................................................................................................................3 2.3. NAPLÁNOVÁNÍ TRASY.........................................................................................................................................4 2.4. VÝŠKOVÝ PROFIL...............................................................................................................................................4 2.5. DATABÁZE VÝŠEK.............................................................................................................................................4 2.6. UŽIVATELSKÉ TESTOVÁNÍ....................................................................................................................................4 2. ANALÝZA A NÁVRH ŘEŠENÍ.........................................................................................................................5 3.1. EXISTUJÍCÍ ŘEŠENÍ.............................................................................................................................................5 3.1.1. Google Earth......................................................................................................................................5 3.1.2. Maps.Google.com............................................................................................................................6 3.1.3. NASA World Wind............................................................................................................................6 3.1.4. GeoShow3D.......................................................................................................................................7 3.1.5. Mapy.cz...............................................................................................................................................7 3.2. VOLBA TECHNOLOGIÍ.........................................................................................................................................7 3.2.1. Prostředí.............................................................................................................................................7 3.3. ZVOLENÉ TECHNOLOGIE.....................................................................................................................................9 3.3.1. JavaScript...........................................................................................................................................9 3.3.2. XHTML a CSS....................................................................................................................................9 3.3.3. PHP....................................................................................................................................................10 3.3.4. MySQL...............................................................................................................................................10 3.4. VOLBA SLUŽEB...............................................................................................................................................10 3.4.1. Veřejná databáze GIS....................................................................................................................10 3.4.2. Mapová aplikace.............................................................................................................................11 3.5. ZVOLENÉ SLUŽBY............................................................................................................................................11 3.5.1. JAK ....................................................................................................................................................11 3.5.2. GeoNames Search Webservice .................................................................................................11 3.5.3. Mapy API ..........................................................................................................................................11 3.6. DATOVÁ ANALÝZA...........................................................................................................................................12 3.6.1. Souřadnicové systémy.................................................................................................................12 3.6.2. Data výšek........................................................................................................................................12 3.6.3. 3D model terénu.............................................................................................................................13 3.6.4. Mapové podklady...........................................................................................................................13 3.6.5. Popis trasy.......................................................................................................................................13 3.7. ARCHITEKTURA KOMPONENT.............................................................................................................................14 3.7.1. Jako koncept...................................................................................................................................14 3.7.2. Jako realizace..................................................................................................................................14 3.8. SYSTÉM NÁPOVĚDY.........................................................................................................................................14 3.8.1. Vznik nápovědy..............................................................................................................................14 3.8.2. Druhy nápovědy.............................................................................................................................15 4. REALIZACE......................................................................................................................................................17 4.1. PROSTŘEDÍ APLIKACE......................................................................................................................................17 4.2. GLOBÁLNÍ FUNKCE..........................................................................................................................................18 4.2.1. Settings.............................................................................................................................................18 4.2.2. Coordinate........................................................................................................................................18 4.2.3. Další funkce.....................................................................................................................................18 4.3. 2D MAPA.......................................................................................................................................................18 4.4. 3D MAPA.......................................................................................................................................................19 4.4.1. Uživatelské nastavení...................................................................................................................19 4.4.2. Problematika Internetu.................................................................................................................20 4.4.3. Generování reliéfu..........................................................................................................................20 4.5. NAPLÁNOVÁNÍ TRASY......................................................................................................................................21

xi

4.6. VÝŠKOVÝ PROFIL............................................................................................................................................22 4.6.1. Uživatelské nastavení...................................................................................................................22 4.6.2. Generování profilu.........................................................................................................................22 4.7. DATABÁZE VÝŠEK...........................................................................................................................................24 4.8. VYHLEDÁVACÍ POLE.........................................................................................................................................24 4.9. NÁPOVĚDA.....................................................................................................................................................25 5. TESTOVÁNÍ......................................................................................................................................................27 5.1. TESTOVÁNÍ FUNKČNOSTI..................................................................................................................................27 5.1.1. Aplikační logika..............................................................................................................................27 5.1.2. Analýza kódu...................................................................................................................................27 5.1.3. Vizuální kontrola.............................................................................................................................27 5.2. Uživatelské testování............................................................................................................................30 5.2.1. Příprava testu..................................................................................................................................30 5.2.2. Testovací uživatelé........................................................................................................................30 5.2.3. Testovací scénáře..........................................................................................................................32 5.2.4. Průběh testování............................................................................................................................36 5.2.5. Poznatky z testů.............................................................................................................................36 6. ZÁVĚR...............................................................................................................................................................37 6.1. SROVNÁNÍ S KONKURENCÍ................................................................................................................................37 6.2. MÍRA SPLNĚNÍ CÍLŮ.........................................................................................................................................37 6.3. ROZSAH PRÁCE..............................................................................................................................................38 6.4. MOŽNOSTI POKRAČOVÁNÍ.................................................................................................................................39 7. LITERATURA...................................................................................................................................................41 A. PROJEKTOVÝ DENÍK...................................................................................................................................43 B. PRŮBĚHY TESTŮ...........................................................................................................................................51 C. UML DIAGRAMY.............................................................................................................................................57 C.1. DIAGRAM C.2. DIAGRAM

NASAZENÍ A KOMPONENT NASAZENÍ A KOMPONENT

– KONCEPT................................................................................................57 – REALIZACE..............................................................................................58

D. SEZNAM POUŽITÝCH ZKRATEK...............................................................................................................59 E. ADMINISTRÁTORSKÁ PŘÍRUČKA............................................................................................................61 F. UŽIVATELSKÁ PŘÍRUČKA..........................................................................................................................63 F.1. F.2. F.3. F.4. F.5. F.6. F.7.

ÚVOD DO APLIKACE......................................................................................................................................63 NÁPOVĚDA K ZÁHLAVÍ APLIKACE....................................................................................................................66 NÁPOVĚDA 2D MAPY...................................................................................................................................66 NÁPOVĚDA 3D MAPY...................................................................................................................................67 NÁPOVĚDA K VÝŠKOVÉMU PROFILU.................................................................................................................67 NÁPOVĚDA PRO NAPLÁNOVÁNÍ TRASY.............................................................................................................67 JAK ŘEŠIT CHYBY A PROBLÉMY......................................................................................................................67

G. OBSAH PŘILOŽENÉHO CD.........................................................................................................................69

xii

Seznam obrázků Obrázek 1: Okno GIS manageru GRASS 6.3..........................................................................................5 Obrázek 2: Instalace NASA World Wind.................................................................................................6 Obrázek 3: Pomocník MS Office...........................................................................................................15 Obrázek 4: Rozklad textury...................................................................................................................21 Obrázek 5: Metody "prepare"................................................................................................................23 Obrázek 6: Metody "solve"....................................................................................................................23 Obrázek 7: Ukázka nápovědy................................................................................................................25 Obrázek 8: Reliéf v aplikaci 3D mapy zčásti stínovaný, zčásti mřížkovaný...........................................28 Obrázek 9: Reliéf v aplikaci Generátor výškového profilu.....................................................................28 Obrázek 10: Reliéf školní plastické mapy..............................................................................................29 Obrázek 11: Reliéf z aplikace Google Earth..........................................................................................29 Obrázek 12: Dispozice testovací místnosti............................................................................................30 Obrázek 13: Ukázka ze scénáře 1.........................................................................................................33 Obrázek 14: Ukázka ze scénáře 2.........................................................................................................34 Obrázek 15: Ukázka ze scénáře 3.........................................................................................................35 Obrázek 16: Ukázka ze scénáře 4.........................................................................................................35 Obrázek 17: Diagram nasazení a komponent – koncept.......................................................................57 Obrázek 18: Diagram nasazení a komponent – realizace.....................................................................58

Seznam tabulek Tabulka 1: Použité stereotypy barev.....................................................................................................17 Tabulka 2: Databázová tabulka výškových dat......................................................................................24 Tabulka 3: Testovací uživatelé..............................................................................................................32 Tabulka 4: Srovnání bakalářské a diplomové práce..............................................................................38 Tabulka 5: Projektový deník..................................................................................................................49 Tabulka 6: Seznam zkratek...................................................................................................................59 Tabulka 7: Obsah přiloženého CD.........................................................................................................69

xiii

xiv

KAPITOLA 1: ÚVOD

1

1. Úvod Dnešní svět pulsuje v rytmu Internetu. Náš každodenní život ovlivňují jedničky a nuly přenášené sítí. Na dosah ruky dostáváme informační bohatství, které podněcuje naše myšlení, rozhodování i pocity. Dozvídáme se o událostech na celé planetě ve zlomcích sekundy. Naši potomci se budou nejspíš učit, že po středověku, novověku a moderní době přišla doba Internetu. Už dnes naše obdoba CML1 zdaleka předčila vize jeho duchovních tvůrců. O budoucnosti Internetu je jisté pouze to, že se s jistotou nedá odhadnout vůbec nic a sebefantastičtější vize předčí čirá skutečnost. Internet je motorem, který vedle civilizované společnosti pohání dokonce i sám sebe, protože prostřednictvím Internetu spolupracují vývojáři na jeho zítřejší podobě. Nastolené trendy se prostřednictvím těchto zpětných vazeb dokonce urychlují. Jen za dobu studií obyčejného vysokoškoláka v první dekádě 21. století se v mnohém změnil způsob jeho práce i forma komunikace s kolegy. Knihovny už nikdy nebudou místem, kde si kvůli davům studentů není kam sednout. Veškeré vědění přichází až k nám domů. Ještě fatálněji se rozdíly odráží u žáků základních škol. Například pokud porovnáme způsob trávení volného času, který se mimo jiné promítl i do jejich chování a vyjadřování. Jestli se jedná o evoluci nebo degeneraci, nechť posoudí čtenář sám. Hojně využívané internetové aplikace i budoucí počiny vývojářů bude používat stále širší část populace, protože počítačová gramotnost ČR překročila2 už 70% a u teenagerů se pohybuje dokonce kolem 97%. Navíc technologie přístrojů umožňuje stále jednodušší přístup kdykoli a kdekoli. Cena připojení k Internetu i možnosti a kvalita přístupu se každoročně zlepšuje. Také bedny v barvě slonovinové kosti postupně nahradily notebooky, netbooky a chytré telefony. Zkrátka člověk aby se brzy před usednutím k práci nejdříve prošacoval. Webové aplikace, které nabízejí užitečné a snadno použitelné služby mají apriori vysoký potenciál, protože vlivem strmého vývoje hardwarových technologií poptávka po softwaru ani nestíhá být uspokojována. Důkazem novodobé zlaté horečky je firma Google, jejíž čistý zisk činí 37 miliard Kč3. Právě ona vedle známého vyhledávače nabízí bezpočet webových služeb, včetně map. K oslovení 400 milionů lidí4 stačí jen dobrý nápad, jak vidno z počtu uživatelů Facebooku. Z českých luhů a hájů stojí za zmínku firma Seznam.cz a.s., která se loni umístila v první stovce nejúspěšnějších českých firem5 a od níž pochází i impuls k tomuto projektu. 1

Zkratka pro superpočítač s názvem Centrální Mozek Lidstva, který podle scénáristů československého seriálu Návštěvníci, bude v 25. století dohlížet na dění na Zemi 2 Podle průzkumu agentury Median ze září 2009 3 Finanční noviny, 16.4.2010: http://www.financninoviny.cz/zpravy/google-vyrazne-zvysil-zisk-a-trzby/463951 4 Údaje statistik Facebooku: http://www.facebook.com/press/info.php?statistics 5 Údaje Czech Top 100: http://www.czechtop100.cz/

2

KAPITOLA 1: ÚVOD

Již od dob prvních jeskynních maleb se lidé snažili zaznamenat a zachytit zemský povrch, ukázat si cestu. Přes objev, že Země je kulatá, jsme dospěli k vytvoření prostředků schopných určit naši polohu s centimetrovou přesností, fotit zemský povrch z oběžné dráhy i mapovat galaxie z druhé půlky vesmíru. Máme v rukou mocné nástroje, které interpretují naši představu o Zemi pochopitelnou formou a umožňují prohlížení z nepřeberného množství úhlů. Éra tištěných papírových map pomalu končí. Jejich vývojový potenciál je vyčerpán. Pro své nesporné výhody tu s námi budou nejspíše vždy, ale budoucnost patří GPS1 přístrojům. Jejich informační obsah je vždy aktuální, díky své interaktivitě nabízí uživatelský komfort na naprosto odlišné úrovni. Dokáží nesrovnatelně lépe pojmout členitost zmapovaného území a přitom díky filtrům neztratit přehlednost. V návaznosti na sledování aktuální pozice přístroje získáváme automatický záznamník našich výletů s podrobnými statistikami. Prohlížení světa z ptačí perspektivy se stalo oblíbenou kratochvílí. Z projektů typu Google Earth [kapitola 3.1.1] je patrné, že revoluce i v tak prastarém oboru jako kartografie, je nejen možná, ale už prakticky klepe na dveře.

1

Global Positioning System – systém určující polohu na Zemi

KAPITOLA 2: SPECIFIKACE CÍLE

3

2. Specifikace cíle Zadání je koncipováno tak, aby navazovalo na bakalářskou práci Generátor výškového profilu [1]. Do značné míry budou převzaty postupy a zkušenosti, ale nejcitelnější změna bude spočívat ve volbě vhodnějších technologií. V důsledku tím vznikne aplikace sofistikovanější, nevázaná na implementační prostředí a otevřenější širší uživatelské obci. Požadavkem je, aby se jednalo o obyčejnou webovou stránku bez nutnosti instalovat speciální zásuvné moduly a provádět jakékoli další činnosti, které běžného uživatele většinou děsí a odrazují. Druhý upgrade bude proveden v datové oblasti výškových dat, aby se jednalo už o konečný plně funkční produkt. K tomu poslouží propojení s veřejnou databází GIS1 [Kapitola 3.4.1.]. Systém lze pomyslně rozdělit na komponenty, kde každá bude plnit určitou úlohu, ale teprve jejich společná provázanost přestavuje gró celého projektu. Stejně jako je v dnešní době nesmyslné vynalézat kolo, je nesmyslné stavět aplikaci "na zelené louce" a přehlížet při vývoji knihovny a funkce, které už existují. Dá se předpokládat, že funkce jako 2D mapa, 3D engine nebo vizualizace grafů už vymyslelo a vyladilo nejméně tucet firem. Také se mezi nimi určitě najdou společnosti, které svůj výtvor nabízí pro nekomerční užití zdarma k dispozici.

2.1. 2D mapa Pro tuto komponentu bude vhodné neplýtvat inovacemi a držet se nepsaných standardů, jak je známe z aplikací Mapy.cz2 či Maps.Google.com3. Už z tohoto důvodu bude vhodné použít některé API4, které (nejen) výše zmíněné aplikace nabízí. API musí být dále schopné zprostředkovat specifické požadavky především kolem tvorby a vizualizace trasy.

2.2. 3D mapa Zdrojem technologické náročnosti systému je právě tato komponenta. Třetí rozměr se na dnešních webových stránkách zatím nezabydlel, možná i z důvodu potřeby různých zásuvných modulů do internetového prohlížeče. Úkolem projektu je tyto potřeby minimalizovat. Postavit 3D mapu na základech stejné specifikace jako zbytek projektu se tedy zdá nejschůdnější řešení. S dnešní architekturou prohlížečů, jimž operační systém dovoluje využít výpočetní prostředky efektivněji a ve větší míře, se tento úkol jeví jako zvládnutelný.

1

Geographic Information System – umožňuje pracovat s informacemi o Zemském povrchu. Nejčastěji analyzovat a vizualizovat požadované atributy vzhledem k prostorovému umístění. 2 [kapitola 3.6.5] Mapová aplikace společnosti Seznam.cz a.s. zdarma k dispozici na http://mapy.cz 3 [kapitola 3.6.2] Mapová aplikace společnosti Google., zdarma k dispozici na http://maps.google.com 4 Application Programming Interface – rozhraní pro individuální tvorbu či modifikaci nabízené aplikace

4

KAPITOLA 2: SPECIFIKACE CÍLE

2.3. Naplánování trasy Že ruční zapisování bodů trasy do tabulky není plánování trasy, to již bylo rozebíráno v bakalářské práci [1]. Tato komponenta by měla úzce spolupracovat s 2D mapou i nabízet rozhraní pro převádění tras z externích zdrojů. Vítaná bude jistě možnost trasu dynamicky měnit, tj. posouvat body, přidávat a mazat body s ohledem na výpočetní náročnost překreslování ostatních komponent při těchto změnách. Např. při odmazání bodu se nic nepočítá, jen se odmaže předmětná část dat trasy. Měla by umět pracovat se všemi běžnými druhy souřadnicových systémů. I s velkým množstvím bodů (desítky) by mělo být možné efektivně pracovat.

2.4. Výškový profil Zobrazení profilu trasy bývá samozřejmou součástí všech map, které pracují i s výškami. Jedná-li se o obyčejný graf, jsou na uživatele kladeny zbytečné nároky na analytické schopnosti. K ruce by mu měly být dynamické osy a provázanost na body trasy na mapě. Vítané budou možnosti nastavení, aby si uživatel přizpůsobil vizuální podobu k účelu, pro který chce výškový profil použít. Samozřejmostí je silná konektivita vzhledem k plánovači tras.

2.5. Databáze výšek Tato komponenta byla nejslabším článkem bakalářské práce [1]. Dá se předpokládat, že veřejná bezplatná databáze GIS [Kapitola 3.4.1.] nebude natolik rychlá a spolehlivá, aby v reálném čase zpracovávala desítky výšek potřebných pro vykreslení reliéfu krajiny. Nutností bude implementovat cache server a jeho plnění daty by mělo být naprosto automatizované. Pro demonstrativní účely aplikace postačí využít nabídek freehostingu, s přesvědčením, že s lepšími hardwarovými podmínkami by se skokově zlepšila rychlost a dostupnost služby.

2.6. Uživatelské testování Každý uživatel si před zasednutím k počítači s naším programem prošel jiným životem. Narodil se s určitými vlohami a následně nabyl rozmanité zkušenosti. Uživatelské rozhraní má za úkol tyto rozdíly stírat. Musí podávat informace jasnou, srozumitelnou, ale stručnou formou, protože v jakémkoli opačném případě uživatel z následné frustrace zahodí celý produkt, byť je jakkoli skvělý a užitečný. Platí to skutečně častěji, než by si člověk byl ochoten připustit. Nejlepší je být obklopen nápovědou kdykoli je potřeba a přitom nevědomky. O tom, jestli tvary, barvy, pozice komponent a interakce korespondují s uživatelovým myšlením, nechť rozhodnou testy.

KAPITOLA 3: ANALÝZA A NÁVRH ŘEŠENÍ

5

2. Analýza a návrh řešení 3.1. Existující řešení Dnešní aplikace nabízejí mnohdy kvalitnější služby, především ve vykreslování 3D reliéfu, ale jsou schovány za hradbou uživatelsky méně přátelského prostředí. Běžný uživatel bývá zmaten a hned nato znechucen buď krátce po spuštění aplikace [Obrázek 1], či ještě před tím [Obrázek 2]. Druhý extrém je naopak velmi přívětivá aplikace, která zase nabízí jen zlomek funkcí. Světlou výjimku tvoří pouze Google Earth [Kapitola 3.1.1.].

Obrázek 1: Okno GIS manageru GRASS 6.3 3.1.1. Google Earth1 V roce 2005 spatřila světlo světa nejsofistikovanější mapová aplikace. Zázemí silného a osvíceného investora a stovek nejchytřejších vývojářů dalo vzniknout aplikaci, díky níž může každý objevovat svět. Podle domovské stránky projektu vám umožní přeletět na libovolné místo na Zemi, zobrazit satelitní snímky, mapy, terén, 3D budovy, vzdálené galaxie ve vesmíru i oceánské příkopy na mořském dně. Jejím prostřednictvím můžete zkoumat podrobný zeměpisný obsah, ukládat navštívená místa a sdílet je s ostatními. 1

3D aplikace společnosti Google., zdarma k dispozici na http://earth.google.com

6

KAPITOLA 3: ANALÝZA A NÁVRH ŘEŠENÍ 3.1.2. Maps.Google.com Přestože se jedná o americký produkt, má od roku 2007 co nabídnout také českým uživatelům. Vlivem omezeného informačního obsahu o našem regionu byla konkurenceschopnost téměř nulová. Portfolio služeb i jejich kvalita se však neustále zlepšuje a pomalu stírá rozdíly v množství a kvalitě mapových dat o ČR u domácí konkurence, navíc tempem, se kterým u nás nemůžou držet krok. Jaroslav Bengl, produktový manažer pro Mapy Google k tomu řekl1: "Český Internet je z oblasti map fenomenální a počtem mapových serverů je ve světě jedinečný, takže rozhodně netvrdím, že máme v průniku na trh lehkou pozici, ale snažíme se a myslím, že rozhodně máme co nabídnout." Letos na jaře aplikace díky zásuvnému modulu též zpřístupnila funkcionalitu Google Earth pro web. 3.1.3. NASA World Wind Konkurent Google Earth, který také nabízí virtuální glóbus. Vyniká především ve vykreslování hornatosti terénu. Dále poskytuje náhled na území postižená přírodními katastrofami, jako jsou záplavy, lesní požáry a hurikány. Umožňuje prohlídku nepřeberného množství vrstev i okolních planet naší sluneční soustavy.

Obrázek 2: Instalace NASA World Wind2

1 2

Rozhovor pro Lupa.cz: http://www.lupa.cz/clanky/mapy-google-v-cestine-realita-nebo-zbozne-prani/ Screenshot webové stránky http://worldwind.arc.nasa.gov/


7

3.1.4. GeoShow3D Počin společnosti Geodis1 má podstatnou výhodu, že se jedná o český produkt zaměřený na středoevropský trh. Můžeme zde proto nalézt nejrealističtější zpracování Vysokých Tater ze sledovaných produktů, 3D modely budov některých turisticky zajímavých lokalit a snímky ČR s úrovní podrobnosti na 5 metrů i snímky pořízené pod nižším úhlem (tím jsou rozeznatelné i strany budov) a další bohatou nabídku vrstev. Umožňuje integraci GPS signálu v reálném čase a tak zobrazovat pozici, orientaci a pohyb navigačního přístroje. Uživatelské rozhraní je minimalistické, přesto přehledné. Nevýhodou je vysoká výpočetní náročnost. 3.1.5. Mapy.cz Zástupce aplikací patřící do druhé části spektra, kam lze zařadit ty nenáročné na instalaci a obsluhu, ale jejich nabídka služeb je značně omezená. Díky podrobně zmapované silniční síti umožňuje vytvářet přesné trasy mezi libovolnými body. Stále nové funkce a vylepšení jsou nutností, neboť slogan „Nejnavštěvovanější mapy na českém Internetu“ nemusí platit na věky. Ohrožení pochází především od zahraničního konkurenta Maps.Google.com [Kapitola 3.1.2.]. Výhoda zvyku uživatelů používat to, co tu bylo dříve, je vrtkavá. Ani široká podpora práce s výškovými daty by na dotažení konkurence objektivně nestačila. Ale snad díky vlastenectví a funkcím, jako schopnosti vyhledat (kromě obligátního Valmezu) také Štatl či Prágl, zůstanou Mapy.cz stále favoritem obyvatel české kotliny.

3.2. Volba technologií 3.2.1. Prostředí Pro prostředí není zapotřebí volit výstřední technologie. Většina moderních webových aplikací stojí na základech XHMTL a u projektu 3D mapy tomu nebude jinak. S přihlédnutím k faktu, že za impulsem k projektu stojí společnost Seznam.cz a.s. a že poskytuje mapovou aplikaci Mapy.cz založenou na JavaScriptu [Kapitola 3.3.1.], je logické přijmout právě tuto volbu. Chování prostředí založené na JavaScriptu je samo o sobě v souladu s trendy, které odstartovala společnost Google, a otevíráme si tím cestu k přednostem AJAXu [Kapitola 3.3.1.] a vizuálním efektům interaktivního chování komponent. Pro úplnou adaptaci bude také nutná přímá manipulace s DOM2. 3.2.2. 3D engine Cest k vytvoření 3D modelu na webové stránce existuje bezpočet. Bohužel pro drtivou většinou je zapotřebí zásuvných modulů pro internetové prohlížeče. 1 2

Domovská stránka produktu GeoShow3D: http://www2.geodis.cz/geoshow3D Více informací na webu se specifikací DOM: http://www.w3.org/DOM

8

KAPITOLA 3: ANALÝZA A NÁVRH ŘEŠENÍ Flash Důkazem použitelnosti 3D vykreslování na základě platformy Flash jsou především počítačové hry. Schopnost práce s vektorovou grafickou, plynulá transformace změny polohy, tvaru nebo průsvitnosti, umožňují animovat efekty bez datově náročných snímků videa nebo rastrové grafiky. I díky těmto přednostem je modul Adobe Flash Player 1 dnes široce rozšířený. Pro práci s audiovizuálními daty a sofistikovanější obsluhu poměrů ve scéně, jako interakce objektů a pokročilé manipulace, lze použít jazyk ActionScript2. Ten ve své verzi 3.0 nabízí očekávaný komfort dnešních objektových jazyků, třídy, obsluhu událostí, regulární výrazivo a také implicitně zabudovanou práci s grafickými objekty. Java Jednou z možností je webový applet3 napsaný v jazyce Java4 a postavený na specifikaci JNLP5. Ten prostřednictvím technologie Java Web Start umožňuje jednoduše poskytovat Java aplikace na Internetu. Odpadá tím ukládání a instalace programu, soubor JNLP stažený jako běžný odkaz z Internetu se o spuštění postará automaticky a se zachováním bezpečnostních pravidel. 3D reliéf generován prostřednictvím knihoven JOGL6 byla varianta uvažovaná v počátcích projektu 3D Mapy, viz. Projektový deník [Příloha A]. JOGL používá např. Nasa World Wind [Kapitola 3.1.3.]. Jedná se prostředek ke zpřístupnění OpenGL7 v prostředí jazyka Java. Obdobně bylo možné uplatnit technologii Java 3D8, která v uživatelské rovině nabízí totožné služby. JavaScript Tato technologie nepotřebuje pro svůj běh zásuvný modul, ale 3D vizualizaci implicitně nenabízí. Veškerá magie kolem 3D vykreslování tkví v možnostech tagu canvas, který je specifikován v HTML 5 [11]. Bohužel canvas není stále podporován v prohlížeči Microsoft Internet Explorer. Tento prohlížeč též vykazuje nevítané unikátní projevy některých JavaScriptových [Kapitola 3.3.1.] příkazů a jeho použitelnost je tím značně ztížena. Avšak ani canvas není zatím koncipován pro 3D, k tomu je nutno dopsat další podpůrné funkce [7]. Přesto Poskytuje dostatečný základ, aby to bylo technologicky možné. JavaScriptu chybí přímá hardwarová podpora, kterou oplývají technologie OpenGL nebo DirectX. Pro účely zobrazování reliéfu krajiny by měla být výpočetní síla i kvalita vizualizace dostačující. S přihlédnutím k faktu, že 2D mapa i AJAX vychází z JavaScriptu, byla konzistence programovací platformy zachována. 3D model lze popsat formátem JSON [Kapitola 3.6.3.].

1

Více informací na webu výrobce: http://www.adobe.com/products/flashplayer/ Práce s jazykem: http://www.actionscript.org/ 3 Více informací na webu Oracle: http://java.sun.com/applets/ 4 Domovská stránka platformy Java: http://www.java.com/ 5 Popis JNLP: http://java.sun.com/developer/technicalArticles/Programming/jnlp/ 6 Více o technologii JOGL: https://jogl.dev.java.net/ 7 Oficiální webová prezentace OpenGL: http://www.opengl.org/ 8 Oficiální podpora Java 3D: https://java3d.dev.java.net/ 2


9

3.3. Zvolené technologie 3.3.1. JavaScript

1

K rozšíření obzorů při tvorbě webových aplikací na základě HTML a Javy přispěl JavaScript v roce 1996, jako produkt firmy Netscape. V následujících letech byl uznán a standardizován renomovanými asociacemi. Může se pyšnit přívlastky multiplatformní, interpretovaný, objektově orientovaný a skriptovací. Kód JavaScriptu může být zapsán přímo do HTML pomocí speciálních tagů nebo jej lze načítat z externího souboru. O samotné provádění skriptu se stará výpočetní jádro internetového prohlížeče na straně klienta. V důsledku toho je rapidně ušetřen výkon serveru, ten se může soustředit na podstatné úkoly, mezi které patří rychlá odezva. Tu uvítá uživatel především. Další cykly CPU ušetří kontrola dotazů na server. Typicky jsou to dotazy přímo formulované uživatelem. O neúplnosti či chybovosti může rozhodnout znalá aplikace bez účasti serveru. Případně lze použít asynchronní JavaScript a XML volání, známá jako AJAX 2. Přestože tento termín je znám od roku 2005 z článku AJAX: A New Approach to Web Applications3, myšlenka nenačítat celou webovou stránku byla propírána již v minulém tisíciletí. 3.3.2. XHTML a CSS Jedná se o nejrozšířenější způsob popisu internetových stránek. XHTML je zkratka anglického "Extensible hypertext markup language", což znamená rozšiřitelný hypertextový značkovací jazyk. Je založený na XML4, z čehož si přináší softwarovou nezávislost a uznávaný standard zápisu i relativně složitě strukturovaných dat. Z HTML pochází zvyklosti prověřené 20 lety praxe popisu dokumentů. Nad všemi těmito specifikacemi bdí The World Wide Web Consortium (W3C). Je jím i HTML 5 [11], které nabízí velmi zajímavé a užitečné možnosti, jako tag canvas [Kapitola 3.2.2.] pro práci s grafikou. Formátováním výhradně prostředky jazyka HTML se velmi těžko dosahuje konzistence grafické podoby. Kvalita a ergonomie webu tím zbytečně upadá. CSS přináší popis podoby dokumentu, který programátorovi umožňuje oddělit informační obsah od vizuálního stylu dokumentu a nabízí komplexní správu stylu v přehledném strukturovaném seznamu. V důsledku tak mohou pracovat autor i designer na dokumentu současně nebo lze vytvořit více podob toho samého webu. Např. v dnešní době vytvoření verze webu pro chytré telefony a PDA. Nevýhodou CSS je jejich nedokonalá implementace v internetových prohlížečích, vizuální kontrola je nutností. Naštěstí se tyto nešvary daří výrobcům postupně napravovat. 1

JavaScript byl použit již v bakalářské práci [1], proto byl popis pouze převzat a zkrácen Více o možnostech AJAXu: http://www.ajax.org 3 Odkaz na článek: http://www.adaptivepath.com/ideas/essays/archives/000385.php 4 Extensible Markup Language - rozšiřitelný značkovací jazyk 2

10

KAPITOLA 3: ANALÝZA A NÁVRH ŘEŠENÍ 1

3.3.3. PHP [5] Podobnost PHP a JavaScriptu vězí pouze ve způsobu začlenění do HTML kódu. Kromě odlišné syntaxe je zásadní rozdíl při vykonávání skriptu, z čehož plynou i odlišné typické aplikace. Provádění se děje na straně serveru, uživatel je seznámen pouze s výsledkem. Proto najde uplatnění nejčastěji při programování dynamických webových stránek, které spolupracují s databází. Velké množství funkcí obstarávají rozsáhlé knihovny pro zpracování textu, grafiky, práci se soubory, přístup k většině obecně známých databází. To umožňuje s výhodou tvorbu rozmanitých nejen serverových aplikací. K velké podpoře a funkcionalitě PHP přispěl i fakt, že se jedná o Open-source 2. Dalšími výhodami jsou platformová nezávislost, či podpora všech běžně používaných internetových protokolů. 3.3.4. MySQL3 Jedná se o relační databázový systém. Díky svým přednostem je jedním z dnes nejrozšířenějších. Vyniká stabilitou, je multiplatformní a podporuje nejpoužívanější programovací jazyky. Pyšní se rychlostí, kterou zpracovává SQL 4 dotazy. Nejnovější verze 5.5 podporuje referenční integritu, vnořené dotazy, transakce nebo triggery. Licenční podmínky jsou volitelné, existuje bezplatná i komerční licence.

3.4. Volba služeb 3.4.1. Veřejná databáze GIS Původním záměrem bylo využít GIS service United States Geological Survey5, protože právě tato organizace je zdrojem dat, která přebírají další poskytovatelé GIS. Jedná se o americkou nezávislou vědeckovýzkumnou vládní agenturu založenou 1879 a patřící do struktur Ministerstva vnitra. Od roku 1962 se také podílí na výzkumu a pořizování map Země, Měsíce a planet. Do 4. března tohoto roku veřejně poskytovala výšková data v rámci Elevation queries against USGS web services (podle Projektového deníku [Příloha A]). Ten den byl celý web přesunut přímo pod hlavičku vlády Spojených států a veřejné poskytování GIS až do května zrušeno. Bohužel spolu s USGS přestala fungovat i většina dalších bezplatných služeb poskytujících výšky. Jednou z výjimek byl naštěstí GeoNames Search Webservice [Kapitola 3.5.2.].

1

PHP bylo použito již v bakalářské práci [1], proto byl popis pouze převzat Open-source znamená licenční i technickou otevřenost, díky čemuž může na vývoji nových verzí pracovat kdokoli, odhalovat a opravovat chyby a za dodržení určitých podmínek zdarma používat. 3 MySQL bylo použito již v bakalářské práci [1], proto byl popis pouze převzat 4 Structured Query Language – strukturovaný dotazovací jazyk sloužící k práci s relačními databázemi 5 Nový odkaz na GISDATA Map Studio USGS: http://gisdata.usgs.gov/ 2


11

3.4.2. Mapová aplikace Z důvodu popsaných už dříve [Kapitola 3.2.1.], že původním zadavatelem je firma Seznam.cz a.s., bylo přímočaré upřednostnit práci s Mapy API [3] na úkor vyspělejšího Google Maps API [Kapitola 3.1.2.]. Žádný další poskytovatel mapové API na takové úrovni nenabízí.

3.5. Zvolené služby 3.5.1. JAK [4] Podle webu tvůrce, kterým je opět Seznam.cz a.s., je JAK kompaktní a jednoduchý systém volně provázaných knihoven, usnadňující práci v prostředí jazyka JavaScript [Kapitola 3.3.1.].. Vznikl na základě potřeby standardizovat a zjednodušit práci při vývoji aplikací tak, aby poskytl nástroje pro řešení často se opakujících požadavků. Byl napsán s ohledem na cíle nevytvářet zbytečně složité konstrukce a pravidla, co nejméně modifikovat běhové prostředí JavaScriptu a zapouzdřit vlastní funkcionalitu, tj, používá vlastní "namespace". Řeší detekci klienta a prostředí, práci s událostmi, nejčastěji používané postupy práce s DOM a HTML a nakonec i práci s AJAXem [Kapitola 3.3.1.]. 3.5.2. GeoNames Search Webservice [6] Databáze výškových dat, názvu míst na planetě a dalších souvisejících informací1 nabízí pohodlný přístup k těmto datům pro vyhledávání. Díky licenci Creative Commons Attribution je možné ji použít zdarma i pro tento projekt. Bohužel cena se odráží i ve spolehlivosti a rychlosti odezvy, přestože je schopna obsloužit 11 milionů požadavků denně. Důležitým atributem je databáze i českých obcí a relativně podrobná výšková data (s přesností přibližně 10 metrů – testováno v rámci tohoto projektu v oblasti Prahy). Veškeré pozicování probíhá souřadnicovým systémem WGS84 [Kapitola 3.6.1.]. 3.5.3. Mapy API 2 [3] Jedná se o obchodní název aplikace postavené na skriptovacím jazyce JavaScript, jejímž prostřednictvím výpočetní jádro webového prohlížeče vysílá požadavky na určené servery s daty. Získaná data aplikace následně podle daných mechanismů prezentuje uživateli. Funkčnost je primárně kladena na prohlížení geografických dat, přesto najde uplatnění i při prohlížení jakýchkoli objemných obrazových informací. Mezi ty patří například rozsáhlá elektrotechnická schémata nebo detailní fotografie. Ve zdrojovém kódu skriptu jsou definovány metody, skrze které si může programátor webových stránek uživatelské rozhraní relativně jednoduše přizpůsobit vlastním potřebám a požadavkům. Služba Mapy.cz [Kapitola 3.1.5.] je prototypem a současně ukázkovým příkladem použití. 1 2

Veškeré služby Geonames.org: http://www.geonames.org/export/ws-overview.html Mapy API bylo použito již v bakalářské práci [1], proto byl popis pouze převzat

12


3.6. Datová analýza 3.6.1. Souřadnicové systémy K výčtu souřadnicových systémů patří i jejich transformace. Tato problematika byla již podrobně rozebrána v bakalářské práci [1] a tak je zde pouze stručný přehled druhů systémů, jehož rozšířená verze je také součástí výše zmíněné práce. WGS 84: World Geodetic System 1984 (zkratka WGS 84), česky Světový geodetický systém 1984, je světově uznávaný geodetický standard vydaný ministerstvem obrany USA roku 1984, který definuje souřadnicový systém, referenční elipsoid a geoid pro geodézii a navigaci. Souřadnicový systém WGS 84 je pravotočivá kartézská soustava souřadnic se středem v těžišti Země (včetně moří a atmosféry). Kladná osa x směřuje k průsečíku nultého poledníku a rovníku, kladná osa z k severnímu pólu a kladná osa y je na obě předchozí kolmá ve směru doleva (90° východní délky a 0° severní šířky), tvoří tak pravotočivou soustavu souřadnic. UTM: Univerzální Transverzní Mercatorův systém souřadnic (UTM) je způsob určování polohy na povrchu Země založený na mřížkách. Od systému šířka-délka se liší v několika zásadních směrech. Nejedná se o jedno mapové zobrazení, ale o síť šedesáti zón zobrazených pomocí transverzního Mercatorova zobrazení. Protože se jedná o zobrazení částí elipsoidu do roviny, lze na mapách v UTM měřit vzdálenost dvou bodů pomocí Pythagorovy věty. Ale pouze v případě, že oba body leží ve stejné zóně. Střed souřadnic je pro každou zónu jiný a tvoří jej průsečík středového poledníku zóny s rovníkem. PP: Interní souřadnicový systém, označován jako PP, je použit v rámci vnitřních výpočetních procesů systému Mapy API a tohoto projektu. Je realizován posunutím UTM a posunutím o 5 binárních pozic (vynásobení/vydělení konstantou 32). Je tak voleno z důvodu, aby se jednalo o celočíselné hodnoty i pro nejmenší odchylky. Jednotka PP totiž představuje pouhou jednu dvaatřicetinu metru, to znamená 3,125 cm. Posunutí je voleno kvůli "hezčím číslům" pro vztažnou zónu střední Evropy (České republiky též), která je 33. 3.6.2. Data výšek Výšky budou přijímány od poskytovatele GIS [Kapitola 3.5.2.] ve formátu XML. Komunikace bude probíhat prostřednictvím http požadavků s danými specifiky pro url adresu. Kvůli bezpečnostním omezením JavaScriptu musí nejdříve projít serverem, kde bude výška teprve předána prostřednictvím PHP ve formátu JSON [Kapitola 3.6.3.] s daty určujícími kontext, do kterého výška patří. Tedy pozice a id pro snazší zpracování.


13

3.6.3. 3D model terénu Nositelem podoby modelu bude formát JSON, neboli "JavaScript Object Notation". Jedná se o text připomínající syntax známých jazyků rodiny C, přesto je zcela nezávislý na platformě. JSON je založen na dvou strukturách1: • Kolekce párů název/hodnota. Ta bývá v rozličných jazycích realizována jako objekt, záznam (record), struktura (struct), slovník (dictionary), hash tabulka, klíčový seznam (keyed list) nebo asociativní pole. • Tříděný seznam hodnot. Ten je ve většině jazyků realizován jako pole, vektor, seznam (list) nebo posloupnost (sequence). 3.6.4. Mapové podklady2 Základní mapové podklady: Vlastníkem je firma PLANstudio s.r.o. Vzhledem k povaze obrazových dat je volen formát gif, který se pro omezené barevné spektrum a nečlenitou povahu dat hodí relativně dobře. Poskytují vhodný poklad pro body zájmu a poloprůhlednou vrstvu stínování krajiny. Turistické mapové podklady: Jejich tvůrcem a poskytovatelem je firma SHOCart s.r.o.. Mapové dlaždice jsou opět uloženy ve formátu gif, protože jejich vlastnosti též korespondují se základními podklady a v této podobě tak nabízejí rozumný kompromis mezi kvalitou a velikostí dlaždice. Fotografické mapové podklady: Mezi uživatelsky oblíbené a užitečné patří ortofotografické podklady. Jednotlivé dlaždice jsou výsledkem leteckého snímkování povrchu republiky. Vlastníkem je Geodis Brno s.r.o. K uložení bylo použito formátu jpg. Historické mapové podklady: Za zmínku rovněž stojí historická mapa z období první poloviny 19. století, kdy probíhalo tzv. Druhé vojenské mapování3, kterou do počítačové podoby zpracovala MŽP ČR Laboratoř geoinformatiky UJEP. 3.6.5. Popis trasy Popis trasy by se měl držet zavedeného řešení Mapy.cz [Kapitola 3.1.5.], které používá metodu referenční vzhledem k předchozímu bodu a jen první bod je popsán kompletní hodnotou souřadnice a používá PP prostor [Kapitola 3.6.1.]. Tento úsporný typ bude součástí url adresy pro snadnou uchovatelnost uživatelských dat. Druhou možností jsou izolované body, aby byla možnost přenosu tras z jiných mapových aplikací. Pro výpočetní účely bude samozřejmě užito druhého typu a souřadnicový systém nebude díky třídě Coordinate [Kapitola 4.2.2.] hrát roli. 1

Převzato z webu: http://www.json.org/ Mapové podklady jsou totožné jako v bakalářské práci [1], proto byl popis pouze převzat a upraven 3 Více o Druhém vojenském mapování: http://cs.wikipedia.org/ , heslo: Druhé vojenské mapování 2

14


3.7. Architektura komponent Architektura je do značné míry determinována zadáním. Původní koncept [Příloha C.1.] byl po podrobné analýze mírně přepracován do podoby odrážející reálnou implementaci [Příloha C.2.]. 3.7.1. Jako koncept Při návrhu bylo přihlíženo k uvažovaným technologiím a komponenty už rozmisťovány s ohledem na jejich specifika. Pod uživatelským rozhraním podobném Mapy.cz [Kapitola 3.1.5] se bude ukrývat architektura plnící následující funkce. Výšky (zajištěno http requesty [Kapitola 3.4.1]), dlaždice [Kapitola 3.6.4] a body zájmu připravuje server běžící pod PHP [Kapitola 3.3.3] klientské JavaScriptové [Kapitola 3.3.1] aplikaci, která dlaždice bude vykreslovat ve 3D prostoru [Kapitola 4.4] díky tagu canvas ve specifikaci HTML5 [11]. Systém dále nabídne nástroje pro tvorbu trasy (Mapy API [Kapitola 3.5.3]) a vykreslí profil [Kapitola 4.6]. Z důvodu dlouhé odezvy serveru s výškami musí být systém doplněn o cache server [Kapitola 4.7] (MySQL [Kapitola 3.3.4]). 3.7.2. Jako realizace Ústředím prvkem aplikace je 2D mapa [Kapitola 4.3.], která slouží pro běžný pohyb po mapě a nabízí prostředky pro vytyčení a úpravu trasy. Navrženou trasu si přes komponentu Trasa [Kapitola 4.5.] přebírají Výškový profil [Kapitola 4.6.] i 3D mapa [Kapitola 4.4.]. Obě tyto komponenty potřebují již ke své činnosti výšková data [Kapitola 3.6.2.], o která žádají ze serveru každá svou cestou [Kapitola 4.6.1.]. Výšky nakonec pocházejí z jednoho zdroje, jen u 3D modelu [Kapitola 3.6.3.] se tak děje tranzitivně přes komponentu Reliéf [Kapitola 4.4.3.], která data shromáždí a posílá celý model najednou. Správa výšek rozhoduje, jestli se požadovaná data budou odebírat z lokální databáze [Kapitola 4.7.] nebo se provede volání směrem k Elevation service [Kapitola 3.5.2.]. Zprostředkovává i plnění databáze výšek. Komponenta Místo->Pozice [Kapitola 4.8.] je pouze přestupní stanicí, protože z bezpečnostních důvodů nelze volat vzdálený server přímo.

3.8. Systém nápovědy1 3.8.1. Vznik nápovědy Je krátkozraké se domnívat, že když to stojí peníze a program to funkčně neobohatí, nemá cenu to dělat. Navíc programátor velmi lehce sklouzne k přesvědčení, že když svému produktu rozumí on, musí jej pochopit každý. Nápověda je pro zpracovatele možná nezábavná a v určitém smyslu demotivující práce, ale rozhodně není zbytečnou nálepkou na krabici komerčního balíku s nádechem profesionality a lacinou snahou o líbivost. 1

Vytvořeno pro diplomovou práci v rámci projektu Styk člověka s počítačem [2]


15

3.8.2. Druhy nápovědy Uživatelské prostředí [Kapitola 4.1.] by mělo být v první řadě samovysvětlující. Návrhář má v rukou mocné prostředky, jak přizpůsobit vizuální vlastnosti komponent, styl jejich interakce, rozmístění atd. Existují však programy, u kterých i nejlepší možný návrh nedokáže přiblížit filozofii, která se za rozhraním skrývá. Je proto nutné vytvořit několik "obraných linií" proti nepochopení. Za samotným prostředím proto stojí "síť" drobných tipů zahrnující např. plovoucí nápovědu [Kapitola 4.9.]. Pozadí dominuje "hradba" s plnohodnotnou kontextovou nápovědou, což je portál zahrnující vše. Hlavní výhodou prostředí je, že uživatel jím podané informace přirozeně vstřebává. Hrají zde roli základní lidské stereotypy. Dobré softwarové prostředí je analogií reálného světa, který vnímáme celý život. Návrhář musí vykazovat vysokou míru empatie a respektovat obecné kognitivní mapy. Pracuje s tvary, barvami, rozmístěním, velikostí a pozicí vůči okolí. Díky správnému prostředí se člověk může snáze dostávat do tzv. stavu flow1, kdy je prací nadšen, pohlcen a vůbec nevnímá okolí. Popisy a plovoucí nápověda dokreslují prostředí v případech, kdy pouhý vzhled nestačí. Zkušenější uživatel je přehlíží, proto jejich vzhled nesmí být výstřední. Tipy a hlášky vycházejí z právě prováděné činnosti a jejich sdělení je maximálně stručné. Jedná se o akceptovatelnou formu předání informace pro dílčí složitější úkon, pro který je vyjádření prostředím příliš problematické. Jako rada od vedle sedící osoby nebo chytré mrkací sponky [Obrázek 3].

1

Obrázek 3: Pomocník MS Office

Flow – jev zaujetí, v češtině znám také jako plynutí. V oblasti IT jev hojně využívaný u počítačových her. Více informací např.: http://www.inflow.cz/flow%E2%80%A6 nebo http://www.artefiletika.cz/modules/articles/article.php?id=40

16

KAPITOLA 4: REALIZACE

17

4. Realizace 4.1. Prostředí aplikace Vizuální vzhled odráží charakteristiky ostatních služeb Seznam.cz. Stejně tomu je u názvů komponent a celé rozvržení stránky je nápadně podobné Mapy.cz [Kapitola 3.1.5.] i detaily mají spojitost na známé služby (např. “Naplánovat trasu“ pochází z http://doprava.mapy.cz). Logo bylo navrženo, aby zapadalo do kontextu1 všech služeb Seznam.cz. Byla snaha přiblížit se ideálu: „Umím s počítačem = umím s tímhle“. K tomu dopomáhá i filozofie systému nápovědy [Kapitola 3.8.]. Prvky jsou standardizované a po seznámení s podobně vypadajícími lze predikovat jejich chování. K intuitivní nápovědě patří mimo jiné použité stereotypy barev: Barva Žlutá

Použití Rozložení komponent v okně

Zelená

Nastavení polohy a vlastností komponent

Modrá

Nápověda

Červená Fialová Šedá

Chyba (chybové hlášení, chybný stav komponenty) Trasa a s tím spojený výškový profil Neaktivní prvek, doplňková nápověda Tabulka 1: Použité stereotypy barev

Dalším plusem je variabilita komponent 2D mapa [Kapitola 4.3], 3D mapa [Kapitola 4.4] a Výškový profil [Kapitola 4.6.]. Nově zobrazená komponenta se objeví vždy v nejexponovanější horní části okna a zbylé zobrazené komponenty budou odsunuty po ní. Uživatel si může rozložit mapy i výškový profil ve velikosti a pořadí, jak uzná za vhodné. Dále má volby: •

•

• • • 1

Automaticky rozbalovat záložky nápovědy – Pokud je otevřený panel s nápovědou, aplikace automaticky rozbalí záložku nápovědy pro 2D/3D mapu nebo Výškový profil, když jedno z nich uživatel zobrazí. Automaticky rozbalovat záložky nastavení – Pokud je otevřený panel s nastavením, aplikace automaticky rozbalí záložku nastavení pro 2D/3D mapu nebo Výškový profil, když jedno z nich uživatel zobrazí. Ukládat aktuální nastavení – Aktuální nastavení se bude ukládat do url adresy. Ruční nastavení pozice pro mapy – Zobrazí v nastavení stejnojmennou sekci s položkami pro číselné zadání pozice pro mapy. Pouze pro pokročilé uživatele. Zobrazit stromy v záhlaví – Vyplní prázdný prostor vpravo od vyhledávacího pole přírodním motivem.

Všechna loga služeb Seznam.cz k vidění na http://onas.seznam.cz/cz/ke-stazeni/loga/

18


4.2. Globální funkce 4.2.1. Settings Celý systém je prostoupen třídou Settings, která je alfou a omegou stavu aplikace. Uživatelská intervence vždy vyvolá signál pro aktualizaci aplikace. To je kriticky důležité pro čitelnost chování systému uživatelem. Settings spustí řetězovou reakci přeposláním signálu všem komponentám. Kaskádovité šíření má výhody už v průběhu vývoje projektu, kde zavedení nového signálu představuje pouze 2 nové řádky, tj. načtení parametru z url hashe a uložení. Pak stačí jen reakce na signál rozestavit do cesty jako dominové kostky podle libosti. 4.2.2. Coordinate Obdoba této třídy byla již s výhodou použita v bakalářské práci [1]. Smyslem je schopnost práce s pozicemi na Zemi bez jakékoli návaznosti na souřadnicový systém. Třída si sama udržuje svoji konzistenci a zapouzdřuje veškeré transformace souřadnic i s ohledem na výpočetní složitost převodů. Integruje testy na formát i správný rozsah hodnot a případně vrátí přesný důvod, proč hodnota nebyla přijata. 4.2.3. Další funkce Dalšími globálními funkcemi jsou metody pro zajištění služeb AJAXu [Kapitola 3.3.1.] a s tím související načítání výšek a překlad názvu místa na pozici. Konečně ve třídě Effects se děje vše kolem vizuálních efektů a rozložení komponent na webové stránce, což je typicky zajištěno změnou CSS stylu [Kapitola 3.3.2.] prostřednictvím JavaScriptového příkazu a zásahu do DOM.

4.3. 2D mapa Pro tuto komponentu bylo v plné míře využito Mapy API. Přesto byla vyžadována určitá specifika, která API implicitně nenabízí. Bohužel rozšiřitelnost nepatří mezi silné stránky a na každém kroku je vidět, že API vzniklo jako extrakt Mapy.cz [Kapitola 3.1.5.]. Některé funkce musely být vytvořeny po mnoha pokusech velmi kostrbatě, protože testy nejednou ukázaly, že API je tvrdě konzervativní černá skříňka, která bezproblémově chodí po vyšlapaných cestičkách Mapy.cz, ale jinak se chová spíš nevyzpytatelně. Práce s API se v mnohém podobala hackování. Důležitou funkcí je vykreslení trasy s možností ji intuitivně měnit. Byla zde např. doplněna funkce výpisu aktuální pozice kursoru myši a souřadnicový systém výpisu lze změnit v "Nastavení", stejně jako atributy popsané na následující straně.


19

Uživatelsky definovatelné atributy 2D Mapy: • • • • •

Zobrazení měřítka a směru k severu – Vykreslí v levém dolním rohu 2D mapy měřítko a šipku směřující na sever. Zobrazení aktuální pozice kurzoru myši na mapě – Vypíše pod mapou GPS souřadnice aktuální pozice kurzoru na mapě. Typ souřadnice pozice kurzoru myši – Typ souřadnice, který představuje aktuální pozici kurzoru myši na mapě. Šířka mapy – Velikost oblasti okna do šířky, ve které je zobrazena 2D mapa. Výška mapy – Velikost oblasti okna do výšky, ve které je zobrazena 2D mapa.

4.4. 3D mapa Tato komponenta úzce spolupracuje s PHP skripty pro generování reliéfu a tranzitivně i načítání výšek. Důraz na univerzálnost se později vyplatil i pro další AJAXová volání [Kapitola 3.3.1.]. Díky práci NihilogicLabs [7] na 3D enginu, který jen tak sám o sobě nemá smysluplné uplatnění, spočívalo těžiště práce ve správném předání modelu reliéfu k vykreslování do scény. Více o technologii vykreslování nabízí [Kapitola 3.2.2.]. Architektura i názvy tříd odpovídají pojetí moderní počítačové grafiky [10]. 4.4.1. Uživatelské nastavení • • • • • • • • • • • • •

Reset scény – Objekt mapy se přetočí do výchozí polohy. Reset nastavení – Všechny následující volby nastavení 3D mapy se přepnou do výchozího stavu (a mapa se podle toho načte). Zobrazit světelné zdroje – Vykreslí žluté tečky na místech, odkud svítí světlo. Osvětlení – Povolí osvětlení/stínování. Odstraňování zadních stěn – Vykreslí se pouze plochy čelní stranou ke kameře. Vyplnit plochy – Vykreslí plochy. Drátěný model – Vykreslí reliéf mapy jako zprohýbané pletivo. Textura – Pokryje plochy mapovým podkladem Stínování textur – Plochy s texturami budou nasvícené podle pozice zdrojů světla. Počet výškových bodů ve scéně – Více bodů znamená lepší rozlišení, ale delší generování mapy. Optimum je "9 x 9". Výškové zkreslení terénu – Výškové rozdíly budou zřetelnější. Kopce budou vypadat vyšší a údolí hlubší. Šířka mapy – Velikost oblasti okna do šířky, ve které je zobrazen 3D objekt mapy. Výška mapy – Velikost oblasti okna do výšky, ve které je zobrazen 3D objekt mapy.

20

KAPITOLA 4: REALIZACE Hloubka generování 3D modelu je z výpočetních důvodů rozdělena na 4 úrovně: Překreslení scény Týká se změny nastavení "Reset scény" a pak všeho od "Zobrazit světelné zdroje" do "Stínování textur". Dále se provede při interakci s myší, tj. nahýbání a posun ve scéně. Změna se provádí pouze v rámci objektu 3D modelu. Překreslení textury Vztahuje se ke změně trasy v oblasti zobrazeného 3D modelu reliéfu. Regenerace postihne celý 3D model od základů. Prakticky proběhne opětovné vygenerování od stavu uložení do lokálních datových struktur [Kapitola 4.4.3.]. Načtení nové textury Tentokrát už je ve hře server s komponentou Reliéf [Kapitola 3.7.2.], tedy komunikace přes Ajax [Kapitola 3.3.1.]. Ten pouze připraví obrázek s texturou a nezbytné informace sloužící pro adresaci přenosu ze serveru. U modelu se následně změní tento jeden údaj o obrázku a dále se postupuje stejně jako výše. Načtení nového modelu Nejkomplexnější změna znamená vygenerování JSON reprezentace 3D modelu [3.6.3.] a připravení textury na serveru. Poslání modelu aplikaci a následně celé vygenerování [Kapitola 4.4.3.]. 4.4.2. Problematika Internetu Zabezpečení prohlížečů proti internetovým škůdcům a rozmanité důsledky použití dočasné paměti představovaly překážky, které se při testech na localhostu často vůbec neprojevovaly. O to víc bylo nepříjemné překvapení po nasazení aplikace v Internetu a následné opravy. Např. PHP [Kapitola 3.3.3.] umožňuje, aby se skript projevil jako obrázek (změní MIME typ [Příloha D] a následně pošle binární data obrázku). Jenže cesta ke skriptu PHP i příznak modifikace souboru se tím nemění. Prohlížeč proto použije dřívější data a ani explicitní atribut, aby se obsah načetl znovu, nenajde při čtení JavaScriptovým příkazem src svého příjemce. To byl důvod zavedení složky temp, kde je název obrázku unikátní. 4.4.3. Generování reliéfu Textura je rozřezána, zohýbána a následně složena do mozaiky tak, že vytváří dojem prostoru. Nejdříve jsou rozparsována data JSON [Kapitola 3.6.3.] definující model, mezi které patří vrcholy a plochy 3D objektu a dále souřadnice a materiály textury. Data jsou uložena do lokálních datových struktur k dalšímu zpracování a případně se přepočítají normály. Nejsložitější je připravit texturu tak, aby nebyla postižena výkonnost renderingu. Každá z ploch 3D objektu musí mít připravenu vlastní instanci třídy image s výsekem textury [Obrázek 4].


21

Obrázek 4: Rozklad textury Plochy 3D objektu ve tvaru trojúhelníku jsou podmínkou schopnosti algoritmu objekt vykreslit. Pomocí UV mapování1 je nanesena textura. Plochy jsou jeden po druhé vykresleny na místě určení s definovanou prostorovou deformací, což je prakticky jen otáčení a změna velikosti určitým směrem. Čtení po jednotlivých pixelech je nejslabším článkem zpomalujícím celý proces. Nelze zaručit naprostou přesnost vkládání pixelů do rastru 2D plátna, proto je u ploch vytvořen miniaturní 1px přesah, který zamezí vytvoření mezer na mapě a přitom ještě objekt nezkresluje. Výhodné je pro přechovávání vertexů použít místo objektu ve třídě image další instance canvasu.

4.5. Naplánování trasy S ohledem na intenzitu komunikace mezi serverem a klientem byla nutností zdvojená třída Coordinate [Kapitola 4.2.2.] sloužící pro uchovávání a automatickou správu souřadnic. Jedna její mutace je implementována v PHP, druhá v JavaScriptu. Jakýkoli pokus o sloučení jsem vyhodnotil jako složitější než duální vedení dvou funkčně totožných dokumentů. Tvorba trasy probíhá v úzké kooperaci s 2D mapou [Kapitola 4.3.]. 1

Více o UV mapování: http://en.wikipedia.org/wiki/UV_mapping

22


Vedle vytyčení trasy na 2D mapě [Kapitola 4.3.] je k dispozici pole pro vkládání url adresy aplikace nebo url Mapy.cz [Kapitola 3.1.5.], které obsahují parametr "dm" s číselnými údaji trasy (u Mapy.cz to znamená aktivní měřič vzdáleností). Narozdíl od vložení do vyhledávacího pole se načte pouze trasa žádné další nastavení mapy (tj. pozice, podklad,... atd.) se nezmění. Poslední možností je vypsat seznam bodů trasy jako jakékoli uznávané souřadnicové hodnoty [Kapitola 3.6.1.] oddělené čárkami nebo libovolnými bílými znaky. Hodnoty budou posuzovány po dvojicích jako pozice bodů trasy: jedna hodnota pro východní délku, druhá pro severní šířku a na pořadí hodnot nezáleží (s výjimkou PP). Pro každé zadávací pole (v celé aplikaci) je k dispozici ukázkový příklad, který si uživatel může v poli zobrazit i vyzkoušet.

4.6. Výškový profil Práce na unifikaci třídy Coordinate [Kapitola 4.2.2.] právě zde přinesla vítané dividendy. Aplikaci vůbec nezáleží na tom, s jakými typy dat pracuje. To se projevuje už při načítání dat trasy, kde se za hradbou regulárních výrazů skrývá dostatečně robustní logika, aby zpracovala cokoli formálně akceptovatelného, co si uživatel zamane. Dále už se jen body trasy v uživatelsky přívětivém kabátku vypisují nebo předávají mapám a výškovému profilu. 4.6.1. Uživatelské nastavení • • • • • • • •

Přesnost profilu – Míra podobnosti profilu se skutečností. Vyšší přesnost znamená i vyšší časové nároky na zpracování profilu. Barva křivky – Barva čáry výškového profilu. Tloušťka křivky – Síla čáry výškového profilu. Zobrazit body trasy ve výškovém profilu – V grafu výškového profilu budou vykresleny stejné značky trasy jako na 2D mapě. Množství vodorovných pomocných čar – Hustota horizontálních linek v grafu, na ose popsány výškou od x-ové osy. Množství svislých pomocných čar – Hustota vertikálních linek v grafu, na ose popsány vzdáleností od počátku. Šířka grafu – Velikost oblasti okna do šířky, ve které je zobrazen graf profilu. Výška grafu – Velikost oblasti okna do výšky, ve které je zobrazen graf profilu.

4.6.2. Generování profilu Proces generování výškového profilu je rozdělen na dvě zrcadlově podobné části, jak je vidět na dvojici jednoduchých diagramů na následující straně, chování v jednotlivých úrovních zanoření je analogické.


23

Metody "prepare" slouží ke zjištění přesných pozic, pro které bude potřeba výškový údaj. Zajistí se AJAXové volání [Kapitola 3.3.1] výšek. Paralelismus zde odpovídá úloze "Producent/konzument".

Obrázek 5: Metody "prepare" Teprve po zjištění všech výškových dat se přistoupí k metodám "solve", které dříve zjištěné výšky použijí k vygenerování výškového profilu, z větší části metodou interpolace.

Obrázek 6: Metody "solve" 3D mapa [Kapitola 4.4.], požaduje celý model reliéfu mapového výřezu [Kapitola 3.6.3.], což značně sníží potřebu komunikace mezi serverem a aplikací. Naproti tomu u volání výšek trasy [Kapitola 3.6.2.] není množství dat tak vysoké a izolovaná volání umožní dynamicky přizpůsobovat požadavky na server a např. odmítnout dříve čekaná data z důvodu změny trasy.

24


4.7. Databáze výšek Databáze MySQL [Kapitola 3.3.4] je tvořena jednou tabulkou. Tabulka byla navržena s předpokladem, že bude obsahovat nejméně desítky tisíc záznamů, proto byl pečlivě volen formát sloupců, aby se neplýtvalo místem. Jeden záznam zabírá 28 B paměti. 80 tisíc výškových záznamů odpovídá 2 170 kB dat, kde 40% (855 kB) zabírají užitečná data, 60% (1315 kB) index.

Sloupec

Typ

Vlastnosti

Nulový

Výchozí

Význam

x

int(10)

UNSIGNED Ne

0

Souřadnice PP[x]

y

int(10)

UNSIGNED Ne

0

Souřadnice PP[y]

elev

smallint(6)

-1

Nadmořská výška [m]

Ne

Tabulka 2: Databázová tabulka výškových dat Její obsluha se děje automaticky v rámci AJAXových volání [Kapitola 3.3.1]. Při požadavku klienta se nejprve zkontroluje, zda už výška není v databázi uložena, teprve potom se zavolá vzdálená request na veřejnou GIS databázi [Kapitola 3.5.2.] a při návratu je výška rovnou do databáze zařazena.

4.8. Vyhledávací pole Do vyhledávacího pole lze zadat následující druhy vstupních dat: Název obce ČR např: "Veverské Knínice" Název města či vesnice v ČR. Nezáleží na diakritice a velikosti písmen. Pokud data nepatří do žádné z dalších dvou skupin popsaných v této kapitole, odešlou se data AJAXem [Kapitola 3.3.1] serveru jako domnělý název obce ČR. PHP skript na serveru vygeneruje http request na server Geonames.org s požadavkem přeložit název místa na GPS souřadnici. Stejnou cestou se vrací odpověď. Pokud je zamítavá, prohlásí se vstupní data za neznámá: "Hledane mesto nebylo nalezeno. Zkontrolujte, prosim, zadany nazev nebo se pokuste misto lepe specifikovat." Url adresa Mapy.cz např: "http://www.mapy.cz/#mm=T@x=135790592@y=138215424@z=12" Konkrétní odkaz "www.mapy.cz" s možností již naklikané trasy z funkce "Měření vzdálenosti".


25

Nejdříve je vstupní řetězec testován, zda se jedná o jakoukoli uznatelnou url adresu Mapy.cz. To znamená s "http" i bez něj, www.mapy.cz i "mapy.cz" apod. Při positivním výsledku se hash adresy rozparsuje stejnými funkcemi jako hash aplikace 3D Mapy, tedy prostřednictvím regulárních výrazů. GPS souřadnice (WGS84 dec/grad, UTM, PP dec/hex) např: "Loc: 50°32'22.388"N, 15°13'37.321"E" Tj. dvojice hodnot bez mezer ve stupních nebo číselně (s desetinnou tečkou). Může začínat textem "Loc" a obsahovat písmena ("N", "E"). Může být rozdělena mezerami a čárkami. Neznámá data se vloží do nové instance třídy Coordinate [Kapitola 4.2.2.]. Tato třída buď uzná souřadnici, nebo vrátí chybovou hlášku. Její znění není podstatné. Testování uvnitř Coordinate probíhá postupným pokusem uložit data do všech souřadnicových systémů. Každý ze systémů má na vstupu nejprve regulární výraz ověřující formát textového řetězce. Pokud projde, je předán na testování číselného rozsahu souřadnic.

4.9. Nápověda Pro nápovědu byly použity metody popsané v kapitole "Druhy nápovědy" [Kapitola 3.8.2.]. Vedle použití stereotypů barev [Kapitola 4.1.] jsou uživateli k dispozici popisky voleb "Nastavení". A jádrem celého systému pomoci i seznámení uživatele s aplikací je "Nápověda". Důležitá je zde funkce tlačítek s otazníkem, čímž si uživatel zobrazí pojem z jiné části nápovědy, který chce také ozřejmit. Od toho už je jen krok, aby se každá odpověď skládala jako stavebnice s dílčích úkonů a uživatel si sám určil míru podrobnosti vysvětlení. Díky manipulaci s DOM nejsou v tomto systému redundantní data, a tak úprava pojmu se promítne všude. Odkazy slouží k přesunu na stav aplikace, který představuje danou problematiku. Papírová a externí webová verze nápovědy nejprve představí odkazované komponenty obrázkem.

Obrázek 7: Ukázka nápovědy

26

KAPITOLA 5: TESTOVÁNÍ

27

5. Testování 5.1. Testování funkčnosti 5.1.1. Aplikační logika Při návrhu se vycházelo z poznatků objektového programování, což zajistilo intuitivní vazbu na business procesy. Tento přístup se osvědčil již v bakalářské práci [1]. Byla tedy použita spirálovitá metoda softwarového inženýrství, která spočívala v obrysovém návrhu struktury zpracovávané části, implementaci a z následné analýzy takto navrženého kódu často vykrystalizoval ještě vhodnější způsob řešení. Třídy i metody tvoří logické entity a při běhu programu se mezi nimi odehrává postupná výměna dat a stavových informací. Snaha byla o minimální zastoupení netransparentních řešení úloh v rámci projektu. Složité problémy jsou rozloženy na jednodušší podúlohy. Následná analýza implementovaného řešení tak spočívala především v posouzení sekvenčních diagramů, které by za každou uživatelskou akcí stály. Nezanedbatelným faktorem pro vývoj však byla i znuvupoužitelnost částí kódu a s tím související vhodné členění do tříd a metod. 5.1.2. Analýza kódu Pro debugging byl s výhodou použit zásuvný modul Firebug [8] prohlížeče Firefox. Ten nabízí jeden z nejpoužitelnějších nástrojů pro analýzu JavaScriptového kódu. Dokáže zkontrolovat validitu HTML a umožňuje dočasně měnit kód za běhu. Nabízí intuitivní nástroje pro analýzu výkonu a přesně zjistí využití sítě. Důležitou funkcí, která ušetřila desítky hodin vývoje, je lokalizace a pojmenování chyb v JavaScriptu, CSS, a XML. Má integrováno logování, čímž bylo možné odhalit i mnohem záludnější chyby. V neposlední řadě zde máme přehledný prohlížeč DOM1. K dispozici jsou i další rozšíření funkčnosti. 5.1.3. Vizuální kontrola Stejně jako u bakalářské práce [1] zajistí komplexní a definitivní kontrolu bezchybnosti generování trojrozměrného povrchu krajiny nejlépe porovnávací test v opravdovém prostředí. Aby byla podobnost, respektive rozdíly, patrná co nejlépe, test je opět situován do hornaté oblasti Krkonoš v okolí Špindlerova Mlýna. Bylo také nutné otestovat zobrazení ve vybraných internetových prohlížečích. Vykazují viditelné, ale naštěstí pouze marginální zkreslení.

1

DOM znamená Document Object Model – více na: http://www.w3.org/DOM/

28


Obrázek 8: Reliéf v aplikaci 3D mapy zčásti stínovaný, zčásti mřížkovaný

Obrázek 9: Reliéf v aplikaci Generátor výškového profilu [1]


29

Obrázek 10: Reliéf školní plastické mapy

Obrázek 11: Reliéf z aplikace Google Earth [Kapitola 3.1.1.]

30


5.2. Uživatelské testování 5.2.1. Příprava testu Pre-test dotazník zmapoval schopnosti osoby. Uživatel dostal seznam úkolů, které má provést na listu formátu A4. To jsou scénáře popsané v kapitole 5.7.3. Po absolvování testu následoval post-test dotazník k vyjádření návrhů a zhodnocení, což spolu s analýzou průběhu testu tvoří obsah kapitoly 5.7.5. Oba dotazníky obsahovaly otevřené otázky, aby se neztratily nuance ve vyjádřeních testované osoby. Test probíhal v běžných domácích podmínkách.

Obrázek 12: Dispozice testovací místnosti 5.2.2. Testovací uživatelé Předpokládaný běžný uživatel je ve věku 24 – 55 let, má nejméně středoškolské vzdělání, oplývá základní schopností práce s počítačem a používá Internet. Umí alespoň trochu zacházet s běžnými mapovými aplikacemi typu Mapy.cz [Kapitola 3.1.5.] nebo Maps.Google.com [Kapitola 3.1.2.]. Netrpí vážnými handicapy. Test proběhl s reálnými osobami. Nemůže být prohlášen za průkazný, protože byl proveden pouze s pěti testovacími uživateli. Volba osob z opačných konců spektra předpokládaných uživatelů dala vyniknout rozdílům a umožnila aproximovat na cílovou skupinu mnohé typy problémů, na které se v průběhu testu přišlo.


31

Martin Pohlaví Věk Bydliště Vzdělání Zaměstnání Zájmy Obecná schopnost práce s počítačem Zkušenosti s mapovými aplikacemi Handicap

muž 28 let Praha 3 Hotelová škola asistent projektantů družka, dítě, divadlo 30%: Běžná uživatelská: Word, Excel, prohlížení Internetu Mapy.cz, Maps.Google.com, Google Earth žádný

Jana I. Pohlaví žena Věk 32 let Bydliště Praha 3 středoškolské (nedokončené vysokoškolské se Vzdělání zaměřením žurnalistiku) Zaměstnání administrativa – dokumentace, žádosti, smlouvy Zájmy fotografování, tanec, divadlo 80% : Email a Word, Excel na běžné uživatelské Obecná schopnost úrovni, počítačové hry (adventury a tahové strategie), práce s počítačem úpravy fotografií (Photoshop, Corel) Zkušenosti s mapovými Používá mapy.cz, Infomapu, Gisel aplikacemi Handicap žádný

Jana II. Pohlaví Věk Bydliště Vzdělání Zaměstnání Zájmy

žena 37 let Újezd nad Lesy Přírodovědecká fakulta UP ekologická osvěta geografie, biologie, cyklistika

Obecná schopnost 30%: uživatelsky Internet, Word, Outlook práce s počítačem Zkušenosti s mapovými papírové turistické mapy, trochu Mapy.cz aplikacemi Handicap žadný

32

KAPITOLA 5: TESTOVÁNÍ Lojza Pohlaví muž Věk 63 let Bydliště Praha 8 Vzdělání vyučen (strojní zámečník) Zaměstnání technický náměstek Akademie věd ČR Zájmy chalupa, hodinky 30% : email a office na nižší uživatelské úrovni, Obecná schopnost evidenční programy (Helios na objednávky), hry práce s počítačem (Mafia), netrpělivost Zkušenosti s mapovými Minimální, párkrát použil Mapy.cz, když něco hledal aplikacemi Handicap mírná dalekozrakost – měl brýle Eva Pohlaví žena Věk 56 let Bydliště Jičín Vzdělání Vysoká škola ekonomická Zaměstnání účetní, daňová poradkyně Zájmy zahrada, šachy 40%: především účetní programy a vyplňování Obecná schopnost formulářů, Internet na střední úrovni, z grafických práce s počítačem aplikací pouze jednodušší hry Zkušenosti s mapovými Minimální, párkrát použila Mapy.cz, ale bylo to prý aplikacemi náročné Handicap žádný Tabulka 3: Testovací uživatelé 5.2.3. Testovací scénáře Scénář 1 O víkendu plánujete na kole navštívit festival "Jičín - město pohádky". Dnes ráno Vám navíc volala tetička z Turnova, ať přijedete, že peče buchty. Při plánování trasy jste si však uvědomil(a), že tetička buchty vždycky spálí a nejsou k jídlu. Proto raději cestu přehodnotíte, abyste se stavil(a) ve své oblíbené restauraci "Jizera" na náměstí v Semilech. Zjistíte, jestli cesta nebude moc náročná co do hornatosti a najdete si nejvyšší bod trasy, kde bude pravděpodobně pěkný výhled. Upravíte barvu výškového profilu, aby byla vhodnější pro tisk.

KAPITOLA 5: TESTOVÁNÍ a) b) c) d) e) f)

33

Prostřednictvím 2D mapy nebo vyhledávacího pole najděte město Jičín. Navrhněte trasu z Jičína do Turnova (stačí 4 body trasy). Upravte trasu tak, aby vedla přes Semily. Podívejte se na výškový profil této trasy. Zjistěte výšku nejvyššího bodu na trase. Změňte barvu grafu profilu na černou.

Obrázek 13: Ukázka ze scénáře 1 Scénář 2 Při nedávném výletu do Krkonoš jste se s rodinou svezl lanovkou z Pece na Sněžku. Rodinná jízdenka Vám připadala předražená. Zjistíte si parametry trasy lanovky na Sněžku, abyste je mohl předat k analýze kamarádovi, který provozuje lanovky na Šumavě. a) b) c) d) e)

Najděte obec "Pec" (pod Sněžkou). Na 2D mapě s turistickým podkladem vytyčte trasu lanovky na Sněžku. Upravte pohled na 2D mapu přibližně podle přiloženého obrázku (2). Otevřete 3D mapu a naklánějte reliéf. Posuňte reliéf do levé poloviny 3D scény.

34


Obrázek 14: Ukázka ze scénáře 2 Scénář 3 Nějaký řečník na včerejší schůzi Českého svazu chovatelů poštovních holubů se vytahoval, že jeho svěřenci zvládnou i v sopečném popelu trasu z Aše do Zlína pod 2 hodiny. Podíváte se, jestli je to vůbec fyzicky možné. Při pohledu na mapu Zlína si vzpomenete na nedávnou reportáž Toulavé kamery, jak se na říčce Dřevnice, která městem protéká, pořádaly oblíbené "Baťovy lodičky" - plavby na čemkoli. Jakou vzdálenost asi musely bárky na vodě překonat? A jaké jsou souřadnice pokladu, který byl prý při příležitosti této akce na břehu u startovní čáry zakopán? a) Zjistěte vzdušnou vzdálenost mezi městy Aš a Zlín. b) Na říčce protékající Zlínem vytvořte od východu trasu o nejméně 13 bodech. c) Zjistěte souřadnice 1. bodu trasy ve formátu "WGS dec".


35

Obrázek 15: Ukázka ze scénáře 3 Scénář 4 Na Internetu jste objevil(a) hezkou webovou stránku o pražském metru i s odkazy na Mapy.cz, kudy trasy vedou. Zajímává Vás, co je pravdy na tom, že stanice Náměstí míru je položena nejhlouběji, protože Vinohrady leží na kopci. a) Zobrazte výškový profil trasy, která pochází z odkazu na Mapy.cz: http://www.mapy.cz/#mm=ZP@x=132939776@y=135274496@z=7@dm=133013504+135998464+24832-8448+1024023552+14592-10752+17408-14592+15104-16640+14336-15360+28928+7424+26880+2304+28160+2304+4096022016+37888-16896+20992+29952

b) Prohlédněte si trasu na 2D mapě c) Podívejte se na výškový profil trasy

Obrázek 16: Ukázka ze scénáře 4

36


5.2.4. Průběh testování Testy probíhaly na hotovém projektu, který je vypálen na CD. Dokumentace průběhu je předmětem přílohy [Příloha B.]. 5.2.5. Poznatky z testů Celkové zhodnocení, co odpozoroval organizátor testu a co řekli sami uživatelé v post-test dotazníku: Martin: Martinovi připadá aplikace užitečná a vyjádřil přání, aby i Mapy.cz takové věci uměly. Zeptal se, jestli je grafická podoba konečná, představoval by si ji hezčí, např. kulatá tlačítka jako design Windows Vista. Uvítal by plánovač tras se dvěma políčky pro zadání výchozího a cílového bodu. Od používání aplikaci by jej určitě odradilo dlouhé čekání, ale celkově je spokojen. Jana I.: Jana je zkušená a bystrá. Přestože během testu zápasila s únavou, zvládla ho bez fatálních zádrhelů. Nejvíce ji prý štvalo pomalé načítání. Jana II.: Ráda by viděla všechny možnosti práce s komponentou stále, tj. všechny popisy akcí a nastavení. Vyjádřila přání plánovače tras se dvěma políčky pro zadání výchozího a cílového bodu. Předvedené funkce prý na Mapy.cz chybí. Lojza: Stěžoval si, že nerozumí pojmům jako "url adresa". A k aplikaci se vyjádřil větou „Napoprvý prostě nevíš, kam máš šáhnout.“. Eva: Bylo by dobré, kdyby se zobrazoval seznam známých míst, jako je tomu např. u aplikace IDOS1. Další vítanou funkcí by prý bylo tlačítko "Zpět", které by rovněž mělo plnit funkci "Panika", když je uživatel ztracen a neví kam dál. Upozorňovala, že nezná pojem "url". Co uživatel, to osobnost s jinými návyky a jinými problémy s aplikací. Přesto se dá vypozorovat několik aspektů napříč celým spektrem uživatelů. Všem nějakým způsobem chybělo zažité: "výchozí bod","cílový bod" a trasa vygenerovaná automaticky. Každý, kdo zavítal k nápovědě 3D mapy, nejprve omylem četl tu pro 2D. Shoda panovala v názoru, že obtížnost aplikace je pouze v prvotním užití a při běžném používání nebude její obsluha překážkou. Důležitými poznatky je, že jen 40% z testovaných vědělo, co znamená url. Mladší generace vnímala funkci pro odmazávání bodů jako: vyber bod a po stisknutí tlačítka "Odmazat bod" bude tento vybraný bod vymazán. Pro čiště marketingové účely by neškodilo obětovat více datového přenosu a výpočetního času pro grafický vzhled.

1

Aplikace IDOS: http://jizdnirady.idnes.cz/

KAPITOLA 6: ZÁVĚR

37

6. Závěr 6.1. Srovnání s konkurencí Ideální koncepční předlohou byly Maps.Google.com [Kapitola 3.1.2.]. Ani tentokrát se není radno pouštět do přímé konfrontace s tímto projektem. Navíc za ony 2 roky se její propracovanost zvýšila exponenciálně. Přestože se podařilo v mnoha ohledech bakalářskou práci [1] předčit, stále je to běh na dlouhou trať. Asi jako máváním rukou dohnat raketoplán Endeavour letící na oběžnou dráhu sbírat nová výšková data. Při srovnání s veškerou konkurencí [Kapitola 3.1] otevírá aplikace založená kompletně na běžných webových technologiích XHTML, CSS a JavaScript bez nutnosti jakýchkoli zásuvných modulů prostor pro použití na veřejných místech, jako jsou typicky knihovny. Prohlížení 3D reliéfu krajiny s takovými omezeními žádný konkurent nenabízí. Dále vlastní přínos práce vidím v prosté přívětivosti k běžnému uživateli. Testy ukázaly, že rozhraní plní svůj účel.

6.2. Míra splnění cílů Při vývoji jsem dbal nejen na to, aby byly splněny všechny vytyčené cíle plynoucí ze zadání, ale také aby produkt vykazoval určitou kvalitu a mohl bych se pod něj s klidným svědomím podepsat. Snažil jsem se vytvářet řešení elegantní, transparentní a důsledná. Že tento "pracnější" přístup přináší své ovoce, jsem se během vývoje nejednou přesvědčil. Jsem rád, že jsem prací na tomto projektu mohl také reagovat na nedostatky vyslovené v posudku a oponentuře k bakalářské práci [1] i předehnat vize z kapitoly "Možnosti pokračování", které v ní byly nastíněny. Nedostatkem je pomalost generování 3D modelu. V tomto smyslu jsou slova ze specifikace cíle [Kapitola 2] o neprovádění jakékoli další činnosti, které běžného uživatele většinou děsí a odrazují, nenaplněna. Čekání je bohužel typickým zástupcem takové činnosti, byť se tam v kontextu jednalo o různá stahování souborů a složité instalace.

38

KAPITOLA 6: ZÁVĚR

BP: Generátor výškového profilu Starší a již překonaná technologie, která neodráží současné trendy Závislé na operačním systému Windows nebo produktu Borland Kylix

DP: 3D Mapy Nové a pokrokové technologie v souladu se současnými trendy

Platformová nezávislost

V prvních fázích požaduje databáze výšek intervenci uživatele

Automatická správa databáze výšek naplněná daty

Možná a pochopitelná nedůvěra uživatelů ke spuštění souboru staženého z Internetu na vlastním počítači

Naprostá důvěra uživatelů ke "spuštění" aplikace s ohledem na bezpečnostní rizika

Menší přímá provázanost na software (a chyby) třetích stran

Více spoléhá na software, v rámci kterého je spuštěn (webový prohlížeč)

Rychlejší vykreslování 3D reliéfu s přímou podporou hardware

Pomalejší generování 3D grafiky závislé na výpočetních prostředcích, které systém přiřadí prohlížeči

Tabulka 4: Srovnání bakalářské a diplomové práce

6.3. Rozsah práce Jak už bylo rozebráno v úvodu, implementace byla ztížena velkým množstvím knihoven, které aplikace využívá. Jedná se především o Mapy API o rozsahu mnoha tisíc řádků. Přiložená dokumentace hrubě neodpovídala nárokům, které jsem na API kladl já. Proto jsem se často musel uchýlit k reversnímu inženýrství i metodě pokus/omyl. Dalšími knihovnami byly widgety na vykreslení výškového profilu a výběr barev. Především první zmíněný vyžadoval široké rozšíření a nové funkce. Jednalo se o dynamické osy, vykreslení bodů trasy, popisky os a hlavně samotná křivka, která dosud umožňovala vykreslení x-ových hodnot pouze v konstantních intervalech. Musel jsem se také dopodrobna zorientovat v JavaScriptovém vykreslování otexturovaných objektů pro 3D mapu. Dohromady se tedy jedná o tisíce řádků Mapy API a přes 3500 řádků zdrojových kódů widgetů a 3D enginu. Skripty vytvářené od začátku do konce v rámci projektu zaujímají i s komentáři a mezerami přes 6000 řádků. Ovšem stejně jako ve stavebnictví, navozit 6000 tun materiálu je úplně něco jiného než z toho postavit stojící budovu.

KAPITOLA 6: ZÁVĚR

39

6.4. Možnosti pokračování Část nápadů k vylepšení poskytly uživatelské testy [Kapitola 5.2.5.]. Maličkosti jako vícenásobná zmínka v nápovědě pro 2D/3D mapu, že jedná o právě o 2D/3D, nebyly provedeny jen proto, aby stav aplikace odpovídal testovací variantě. Stejně tomu je u přejmenování "url adresy" na "webovou adresu". Funkce jako automatické vytyčení trasy však vyžadují buď za tím účelem nabízenou webovou službu, nebo velmi složitou implementaci grafových algoritmů a obsáhlou databázi cest, což zdaleka přesahuje tento projekt. Reálnější se jeví automatické modelování 3D mapy, kde by při pohybu s mapou bylo zajištěno dogenerování objektu mapy. Tj. chovala by se obdobně jako 2D mapa. Řešením nezdarů v poznávání aplikace by mohla být volba zobrazení řádku pod hlavním panelem s tlačítky, kde by se vypisovaly informace vztahující se k právě prováděné akci, nebo by obdobnou službu prokázal tutoriál. Především z časových důvodů nebyla realizována ještě větší provázanost komponent. Například kliknutí na jakékoli místo výškového profilu (nejen na značku bodu trasy) by také vyvolalo přesun na 2D mapě k tomuto místu. Uvažoval jsem o nasazení interpolátoru, který by umožnil plynulé rozevírání komponent, např. efektní příjezd "Nastavení" či "Nápovědy" zpoza pravé části okna. Před masivnějším nasazením bych určitě ještě více přesunul výpočty 3D modelu ze serveru ke klientovi. Skripty PHP by zajišťovaly čistě servis na jednotlivé výšky a jejich dosazování do modelu by prováděl až JavaScript. To znamená vyšší frekvenci komunikace a tím i vyšší datové přenosy, neboť užitečné informace tvoří jen část přenášených paketů. Ale na druhou stranu se ušetří cenné prostředky serveru a tento jev tím převáží.

40

KAPITOLA 7: LITERATURA

7. Literatura [1]

Lukáš Jelínek: Bakalářská práce – Generátor výškového profilu http://gvp.tym.cz

[2]

Lukáš Jelínek: NaviTerier Authoring Tool http://service.felk.cvut.cz/courses/X36SCP/prj/jelinlu3

[3]

Seznam.cz: Mapy API v2.0 http://api.mapy.cz

[4]

Seznam.cz: JavaScriptová knihovna JAK http://jak.seznam.cz

[5]

PHP Documentation Group: PHP Manual http://php.net

[6]

GeoNames Team: GeoNames Search Webservice http://www.geonames.org

[7]

Jacob Seidelin: Experiments in JavaScript, Canvas and DHTML http://www.nihilogic.dk/labs/

[8]

Firebug Working Group: Firebug http://getfirebug.com

[9]

Marek Prokop: Kaskádové styly pro webdesignery Mobil Media, 2003

[10] Žára, Beneš, Sochor, Felkel: Moderní počítačová grafika Computer Press, 2005 [11] W3C: Specifikace HTML 5 http://www.w3.org/TR/html5/

41

42

PŘÍLOHA A: PROJEKTOVÝ DENÍK

43

A. Projektový deník 29.1.2009

25.2.2009

Náhodou jsem potkal pana Berezovského, bavili jsme se o možnostech a požadavcích na diplomovou práci. Sepsal jsem možné alternativy pokračování bakalářské práce a poslal je panu Berezovskému k uvážení. Jednalo se především o přepis do multiplatformního jazyka (Java) a myšlenku přímé provázanosti na gisdata.usgs.gov. Přišla odpověď od pana Berezovského, že dotažení do datové nezávislosti samo osobě není úplně ono.

16.3.2009

Pan Berezovský navrhl vytvoření webového cestovního deníků. Odpověděl jsem, že Google Earth už podobnou funkcí disponuje a to v provedení, kterému nemám šanci konkurovat.

6.4.2009

Při setkání jsme se shodli, že by byl potřeba neotřelý nápad, na kterém by se dalo stavět. Rozvinul jsem myšlenku přenést aplikaci kompletně na Internet.

19.6.2009

Zjišťoval jsem možnosti zobrazení 3D objektů v Internetových prohlížečích. Vyhodnotil jsem jako nejlepší java applet fungující s podporou https://jogl.dev.java.net/.

27.6.2009 18.9.2009

19.9.2009

Formulování zadání. Porovnávání rozdílů mezi technologiemi Java 3D, LWJGL a JOGL Studium a zjišťování možností knihovny JOGL (Java OpenGL Bindings) Studium specifikace JNLP (Java Network Launch Protocol) Tvorba appletů postavených na JNLPAppletLauncher Za pomoci Java Web Start vytvořeno automatické načítání podepsaných grafických knihoven z java.net

20.9.2009

Testování JNLP extenzí Zprovoznění appletu vykreslující OpenGL s využitím JOGL Zajištěna platformní nezávislost a automatické aktualizace použitých knihoven Sestaveno zadání na základě všech předchozích zkušeností

23.9.2009

Mail panu Berezovskému se zadáním a prosbou o vyjádření k budoucnosti projektu Odpověděl, že mi doporučí někoho, kdo by mou práci vedl.

1.11.2009

Porovnávání a testování poskytovatelů výškových dat - tzv. geo web service

8.11.2009

Zkoumání možností tagu "canvas" ve specifikaci HTML 5 pro zobrazení 3D mapy

28.11.2009

Zjištěny podrobnější informace o United States Geological Survey, která poskytuje výšková data

28.11.2009

Navrženo uživatelské rozhraní prohlížeče mapy jako appletu

3.12.2009

Podklady k prototypu zobrazující 3D objekt na HTML canvas

10.12.2009

Analýza implementace 3D zobrazení prostřednictvím JavaScriptu, kterou vytvořila Nihilogic Labs

11.12.2009

Webová stránka prototypu zobrazující čtverec s texturou s možností zobrazení světel, mřížky, … atd.

12.12.2009

PHP skript pro načítání obrázků z externích serverů

44

PŘÍLOHA A: PROJEKTOVÝ DENÍK Zjištěna omezení při načítání obrázků prostřednictvím PHP - nelze pracovat s parametry ($GET) 13.12.2009

Odeslán mail panu Berezovskému s popisem mých pokroků a návrhem, že bych oslovil členy skupiny Webing Načtení dlaždice z mapy.cz do 3D mapy Zavedení PHP sessions pro správu aktuálního mapového podkladu

16.12.2009

Registry pro typ, pozici a zoom mapového podkladu Opraven skript pro načítání obrázků - automatická detekce "mime" typu Opraveno rozlišení mapových dlaždic v 3D mapě

19.12.2009

Podklady k editaci událostí vyvolaných uživatelem Dlouhá série pokusů a omylů se změnami textury dlaždic (problémy s cachovací pamětí)

20.12.2009

PHP upload obrázků na server, aby bylo možné měnit dlaždice Zprovozněno zoomování pomocí kolečka myši Zavedení třídy pro správu souřadnic (PP prostor, UTM a WGS64)

21.12.2009

V JavaScriptu implementace a testování převodních funkcí mezi souřadnicovými systémy Zdlouhavé tápání, jak efektivně použít JavaScriptouvou knihovnu s převody při práci s PHP

22.12.2009

Přepsání knihoven pro převod souřadnic do PHP Do zdrojových kódů přidány komentáře o původů a autorech převzatých funkcí Zprovoznění XDebug rozšíření PHP pro analýzu skriptů v IDE NetBeans Hledání chyb ve třídě Coordinate (převodní funkce)

23.12.2009

Implementovány převody ze souřadnic zapsaných ve stupních a ošetřeny možné chyby vstupu Posun reliéfu ve scéně prostřednictvím drag&drop

26.12.2009 27.12.2009

Automatické generování vertexů ve scéně (body, plochy, normály a otexturování) Problémy s rychlostí odezvy serveru s výškami Analýza správnosti výškových dat Čtveřice dlaždic zobrazena na mapě Posun scény kompatibilní s rotací mapy

29.12.2009

Vytvořeno logo "3D mapy" Design uživatelského rozhraní Tlačítka ovládání mapy, nastavení a nápovědy, url vstupní řádek

30.12.2009 3.1.2010

Zoomovací panel Design tlačítek v záhlaví Rozbalovací seznamy (navigace) nastavení a nápovědy Interaktivní změna vzhledu tlačítek při najetí myši

4.1.2010

Ovládací prvky výběru podkladu, zoom a info řádek v mapě Trojrozměrné otáčecí logo vyjadřující "Čekejte, prosím..."


45

Panel s ovládacími prvky pro přepínání 2D-3D-výškový profil 5.1.2010

Testování designu v různých prohlížečích Vylepšen panel pro zoomování Ikonka pro záhlaví okna a další použití

7.1.2010

Diagram nasazení a komponent projektu E-mail firmě Seznam.cz a členům skupiny Webing na Katedře počítačů s nabídkou vedení mé práce

11.1.2010

Úvahy o cache serveru: paměťové nároky, vhodné servery, struktura dat

19.1.2010

E-mail panu Berezovskému s mým záměrem se sejít s vedoucím Katedry počítačů

20.1.2010

Zřízeny webové stránky projektu se zadáním a architekturou projektu

21.1.2010

Schůzka s vedoucím katedry počítačů o hledání vedoucího/oponenta Setkání s panem Berezovským o proběhu práce

25.1.2010

Možnosti Mapy API pro 2D mapu a vytyčování trasy

26.1.2010

Implementace cache serveru pro výšky a temp pro mapové dlaždice Uživatelské nastavení počtu bodů ve scéně a výškového zkreslení

27.1.2010

Interakce tlačítek v záhlaví Nástin funkce pro automatické rozpoznávání typů souřadnic

28.1.2010

Konzultace s panem Berezovským nad notebookem o provedené práci Zkoušení aplikace PhpDocumentor pro generování dokumentace

31.1.2010

Zkoumány možnosti aplikace Google Chart API pro vykreslování výškového profilu Přepsán web projektu do PHP s možností přihlášení pro prohlížení aplikace a zdrojových kódů Několik úprav v duchu poslední konzultace Vizualizace výjimek z útrob PHP skriptů

1.2.2010

Mail panu Berezovskému o aktualizaci webových stránek s možností prohlížení zdrojového kódu Marná snaha rozeběhnout aplikaci na freehostingu Webzdarma (bezpečnostní problémy) Prototyp přesunut na server ic.cz, kde běží bez problémů

2.2.2010

Vylepšena vizualizace rozbalovacích seznamů Komentáře ke zdrojovému kódu, který už se pravděpodobně nebude zásadně měnit Zprovoznění 2D mapy prostřednictvím systému Mapy API

3.2.2010

Marné pokusy naroubovat do Mapy API třídu WebEngine.DistanceMeter (měřič vzdáleností)

4.2.2010

Komentáře ke zdrojovému kódu a "učesávání" kódu Zavedení kompletní PHP dokumentace prostřednictvím aplikace PhpDocumentor

5.2.2010

Aktualizace testovací aplikace na webu s ošetřením funkčnosti 2D mapy a různých lokálních databází Drobné funkční detaily

6.2.2010

Zavedení JavaScriptové třídy Cartograph pro zastřešení 2D a 3D mapy Funkce pro správu v hashi url adresy v JavaScriptu (uchovávání parametrů aplikace)

46

PŘÍLOHA A: PROJEKTOVÝ DENÍK Obecná nastavení programu a uchovávání nastavení Unifikace rozhraní 2D a 3D mapy 7.2.2010

Průtokový update map - funkce projede cartograph i 2D/3D mapu a jednotlivé třídy si vezmou, co potřebují Odchytávání událostí na mapy Sofistikovanější zpracování chyb a odkaz na nápovědu

8.2.2010

Barevně rozlišené sekce nastavení, nápovědy a tvorby trasy Rozbor JavaScriptové knihovny JAK

10.2.2010

Třídění a zálohování

17.2.2010

Zadání bylo podepsáno vedoucím katedry a stalo se tak definitivním, oficiálním a závazným Zavedl jsem odlišné barevné ladění pro různé prvky v souladu se zažitými stereotypy (např. modrá nápověda)

21.2.2010

Řešen konflikt odchytávání událostí myši a klávesnice mezi 2D a 3D mapou Ošetření událostí od kolečka myši pro prohlížeč Google Chrome

22.2.2010

Pokusy o deaktivaci odchytávání stisknutých kláves 2D mapou Poznávání dalších funkcí knihovny JAK s úvaha nad jejich použitím v projektu Pokusy zavést posluchače událostí do map2d tak, aby alespoň události propagoval dále

24.2.2010

Bylo nutné zasáhnout do vnitřních procesů knihovny JAK a dokumentací zde je pouze kód Nekonečným zkoušením reakcí JAKa (z velké části metodou pokus/omyl) se odchytánání kláves povedlo

25.2.2010

Kvůli vysoké (a zbytečné) režii zrušena třída Cartograph a její funkce rozděleny mezi obě mapy a Settings Oddělení událostí 2D mapy na přidání bodu a posun pomocí vlastního hacku kombinující onmousedown/click Aktuální pozice kurzoru 2D myši na mapě a správa kursoru vůbec

26.2.2010

27.2.2010

Interaktivita zoomovacího posuvníku se zobrazením aktuální pozice a zpracování událostí od posuvníku Automatické přizpůsobení 2D mapy aktuální velikosti okna a otevřeným nabídkám aplikace Extrakce jmen autorů mapových podkladů z 2D mapy pro použití ve 3D U 3D mapy zavedena tlačítka pro reset scény a reset nastavení Zpřesněno logické členění kaskádových stylů Funkce pro kontrolu ručně zadaných vstupních dat

28.2.2010

Zvýšena efektivita výpočtu, např. zavedením proměnná "dirty" kvůli opakovanému generování 3D mapy Navržen finální vzhled okna s příklady zadání vstupních hodnot (design totožný s nápovědou)

1.3.2010

Chronologický soupis funkcí, které je potřeba v rámci diplomky vyřešit Automatické scrollování okna k určeným záložkám

3.3.2010

Upravena tlačítka ve 3D mapě a zavedena možnost zastavení renderování mapy tlačítkem "Stop" Přizpůsobení 3D mapy velikosti okna a možnost nastavení relativní velikosti k oknu u 3D i 2D


47

Server USGS byl přesunut pod US goverment a zrušil službu poskytování výšek, čímž vypadly i další GIS servery 4.3.2010

Hledal jsem adekvátní náhradu, nalezl server http://www.geonames.org a provedl změnu vlastního serveru Zobrazení mapového výřezu podle zadaného názvu města

5.3.2010 8.3.2010

Analýza uživatelského vstupu do url řádku (parsování souřadnic a url z mapy.cz) a jeho provedení Správa nastavení aplikace prostřednictvím url hashe Funkce tlačítek pro horizontální pohyb v 3D mapě E-mail do Seznamu.cz zástupci, kterého mi doporučil bývalý manažer map, jako svého "následovníka"

11.3.2010

Ukládání a zlepšení správy aktuálně otevřených panelů aplikace a zrevidována třída Effects Pro rozpoznávání typů souřadnic a uživatelské vstupy použity regulární výrazy Automatická detekce pořadí hodnot souřadnice (east-north, lat-lon)

12.3.2010

Vizuální komponenty nabídek pro tvorbu a načítání trasy

13.3.2010

Zpracování vstupů při zadávání trasy a výpis trasy

16.3.2010

Zpřesnění větných formulací pro uživatele

17.3.2010

Výpis trasy ve všech pěti souřadnicových formátech s možností přepínání Funkce odmazávání bodů a zrušení trasy Výpis zvolených částí dlouhé trasy

18.3.2010

Dynamická změna velikosti tlačítek pro výběr částí trasy podle množství bodů trasy (=množství tlačítek) Načítání trasy z url Mapy.cz nebo za sebou jdoucích hodnot v libovolných formátech Zobrazení trasy na 2D mapu s interaktivními značkami na bodech ohybu

19.3.2010

Sofistikovanější aktualizování trasy na 2D mapě kvůli nepříjemnému probliknutí grafiky během překreslování Vzdálenost od počátku trasy v tabulce bodů trasy Zprovoznění widgetu lbChart, který je postaven nad knihovnou JAK (stejně jako 2D mapa)

20.3.2010

Studování možností a omezení lbChart Nalezen a vyřešen kolizní kurs vrstev mapových podkladů a trasy se značkami ohybů na 2D mapě Matematické funkce pro výpočet pozic pomocných čar s popisky v grafu

21.3.2010

Uživatelské rozhraní pro nastavování vlastností profilu - především okno pro výběr barev

23.3.2010

Doplnění komentářů u JavaScriptových funkcí Kalibrace umisťování bodu trasy hned po načtení mapy na 2D mapu (ošetření bugu Mapy API)

24.3.2010

Ošetření funkčnosti komponent nastavujících výškový profil + jejich zavedení do Settings Vylepšení matematických funkcí pro výpočet pozic pomocných čar s popisky v grafu

48

PŘÍLOHA A: PROJEKTOVÝ DENÍK Plynulé zoomování 2D mapy Uložení trasy do textového souboru ke stažení 25.3.2010

Přepsání PHP skriptu relief s ohledem na vyšší modularitu a možnost generovat pouze texturu Optimalizace JavaScriptu 3D mapy (s důrazem na možnost měnit pouze texturu) V útrobách vykreslování 3D mapy odchyceno plátno kvůli zakreslení trasy

26.3.2010

Lítý boj s chybou: "An invalid or illegal string was specified code: 12" Stínování a správný styl křivky trasy na 3D mapě, aby zapadal do designu aplikace Vykreslování trasy na 3D reliéf s optimální hloubkou překreslování scény

27.3.2010

Zjišťění výšky pro zadaný bod trasy s opožděným zápisem do výpisu trasy (generování tabulky nečeká)

28.3.2010

Dílčí funkce pro výpis výškového profilu (průsečíky s výškovou mřížkou) Uživatelsky srozumitelný výpis chyb ze vzdáleného serveru (nefunkční služby výšky a pozice měst)

31.3.2010

Podoba aplikace pro vypnutý JavaScript Generování průsečíků trasy s mřížkou výšek Načítání výšek do pole s parametry zamezující opakované volání dotazů na server

1.4.2010

Interpolace výškových dat trasy vzhledem k mřížce výšek, jejíž hustota je dána zoomem Uživatelské nastavení přesnosti profilu a jeho testování Upraven widget pro kreslení grafu, aby vypisoval výšky pro různé vzdálenosti (přírůstek byl konstantní)

2.4.2010

Testování výškového profilu a mezních situací v použití Úvodní proslov v nápovědě a přímé odkazy na funkce (doporučený průchod aplikací) Možnost zobrazení více komponent aplikace v levé i pravé části (např. profil i mapy)

3.4.2010

4.4.2010

5.4.2010

Paralelní spolupráce mezi všemi aktuálně zobrazenými komponentami a ukládání rozložených panelů Další pasáže interaktivní nápovědy (přehled komponent, záhlaví aplikace, 2D mapa) Zálohování a aktualizace webu (vystavení zdrojových kódů) Dopsána interaktivní nápověda (nápověda k profilu a plánování trasy, jak řešit problémy a chyby, o aplikaci ) Dynamické načítání plovoucí nápovědy pro součásti nápovědy

7.4.2010 9.4.2010

Soupis kapitol textu diplomové práce Doplněny příklady pro veškerá uživatelská formulářová pole Konzultace s panem Berezovským o provedené práci Minimální výšky a šířky komponent a oprava dalších drobných chyb vycházejících z konzultace Gramatická korektura textů v aplikaci a tohoto projektového deníku

22.4.2010

Opravena záludná chyba paralelismu při rychlém přidávání bodů trasy s aktualizací všech komponent naráz Vymazání přebytečných nepoužitých knihoven a "pahýlů" aplikace, které už "nerozkvetou" Interaktivní popisky os výškového profilu Možnost zobrazení bodů trasy ve výškovém profilu


49

Klikací body trasy pro vycentrování vybraného bodu na mapě 23.4.2010

Možnost přesunu bodů trasy na 2D mapě (včetně kompletní vizualizace) Vyšší zabezpečení relevance dat u 3D mapy při AJAXovém volání

24.4.2010

Oprava mnoha kosmetických i fatálních chyb Dynamická změna zoomu při přidávání bodů trasy s okamžitým promítáním do grafu profilu

25.4.2010

Další vychytávání překlepů a omylů Návrh a tvorba uživatelských testů Zvýšení odolnosti aplikace vůči nefunkčnímu serveru výšek = automatické vyhledávání nejbližších bodů

26.4.2010

Vlastní odečítání pozice kurzoru nad 2D mapou, protože ta z Mapy API se chová nepredikovatelně Sepsány postupy pro administrátorskou instalaci aplikace

27.4.2010

Telefonát s produktovým manažerem Seznam.cz a.a.s. o zhodnocení projektu

29.4.2010

Testování uživatelů Martin a Jana I.

30.4.2010

Testování Jany II.

5.5.2010

Drobná oprava - univerzálnější zpracování příchozích xml dokumentů ze serveru geonames.org

8.5.2010

Testován uživatel Lojza

9.5.2010

Testována uživatelka Eva

Tabulka 5: Projektový deník

50

PŘÍLOHA B: PRŮBĚHY TESTŮ

51

B. Průběhy testů Scénář 1 Martin: Martin s jistotou zadal do vyhledávacího pole "Jičín". Na 2D mapě se pohyboval prostřednictvím ovládacích tlačítek. Poté našel tlačítko "Naplánovat trasu", ale nepoznal, že záložka "Vytyčit trasu na mapě" už je otevřená a kliknul na ni. Byla to totiž první záložka, kterou v této aplikaci viděl a překlikl ji hned několikrát. Po umístění prvního bodu se zeptal sám sebe, jestli to bude dělat čáry a vzápětí se uklidnil, když se tak stalo. Měl radost, když u bodů trasy uviděl výšky. Bez problémů vytvořil body. Pozměnění trasy přes Semily vyřešil zrušením celé trasy a vytyčením nové. Vůbec jej nenapadlo body posouvat. Když měl najít výškový profil, hledal v seznamu bodů trasy a byl přesvědčen, že výškový profil znamená sloupec s výškami. Teprve po 20 sekundách si všiml tlačítka v záhlaví. Své zaujetí pro komponentu, kterou právě zobrazil, vyjádřil slovem: „Hezké“, za čímž následovalo radostné „Tady je ale krpál.“. Zbytek scénáře absolvoval bez zaváhání. Jana I.: Okamžitě vyhledala požadované město. Zde se nejspíš projevila podobnost s Mapy.cz, takže Jana věděla, co má od vyhledávacího pole přesně čekat. Se samozřejmostí posunula body trasy přes Semily. Když měla změnit barvu profilu, zavítala hned do nápovědy, která ji naprosto správně pomohla. Na černou ve výběru barev klikla jednou a čekala, že se tím utilita pro výběr barvy zavře. Kvůli aktuální pozici v okně nemohla vidět tlačítka "OK" a "Storno" ve spodní části utility. Použila dvojklik, kterým scénář úspěšně dokončila. Jana II.: Pro hledání města vůbec nepoužila vyhledávací pole a rovnou se pomocí kolečka myši přiblížila k požadovanému místu. K posunu mapy intuitivně zvolila tažení myší. Stejně se zachovala při hledání cílového bodu trasy. Vůbec netušila, v čem spočívá naplánování trasy. Říkala trasu slovně s tím, že by si ji psala na papír. Až po dvou minutách se s nedůvěrou pustila do prozkoumávání tlačítek v záhlaví. V rozevíracím seznamu nerozuměla pojmu "url adresa". Věnovala desítky sekund prostému přemýšlení, jak se trasa tvoří, než aby něco zkusila. Po umístění prvních bodů byla mile překvapená, že to umí výšky. Při umisťování cílového bodu jemně hýbla s myší, čímž se z kliku stalo tažení a bod neumístil. Pokusila se tedy o to samé dvojklikem, ale tím vytvořila dva body naráz. Omyl si uvědomila a odmazala bod výběrem ze seznamu a stisknutím tlačítka "Odmazat bod". Aplikace ji zaujala natolik, že po absolvování scénáře spontánně zkoumala další možnosti nastavení a otevřela si 3D mapu. Po dvou planých pokusech (klikání na tlačítka posunu mapy) přišla na obsluhu naklánění mapy.

52


Lojza: Lojza se hned vrhnul na vyhledávací pole a také okamžitě věděl, že má stisknout "Naplánovat trasu". Přečetl si pokyny pro vytyčení trasy na mapě a bez zaváhání umístil bod. Pro přesun k Turnovu použil tlačítka 2D mapy. Jako jediný z testovaných uchopil bod trasy a přesunul jen nad Semily. Sebejistě odečetl na výškovém profilu nejvyšší bod trasy. Jen u změny barvy byl zmaten, že se nezměnila i barva trasy na 2D mapě. Eva: První úkon, který provedla po přečtení scénáře, bylo zavření 2D mapy. Přestože ještě nenašla Jičín (bod a) ve scénáři), rychle přešla k plánování trasy a byla "uhranuta" položkou "Načíst trasu z url adresy", kam chtěla zadat město, pročítala popis formulářového pole, vložila do něj příklad a stále se na toto vyptávala. Byla upozorněna, že se jejího scénáře tato položka skutečně netýká. Pak správně zadala město do vyhledávacího pole. Nad 2D mapou vůbec nepoužívala zoom, čímž si přivodila značné potíže s hledáním i vytyčováním trasy. Pro pohyb proto využívala znovu a znovu vyhledávací pole. Potřebovala přímou pomoc, protože trasu podle zadání postě nebyla schopna naklikat. Body d) až f) již provedla správně, byť s mírnou nejistotou. Scénář 2 Martin: Osvědčeným způsobem přes vyhledávací pole našel "Pec po Sněžkou". Po přečtení slov ze scénáře "Na 2D mapě..." zobrazenou 2D mapu zavřel, což odráželo jeho nejistotu, jestli je ona mapa skutečně 2D mapa. Intuitivně klikl do mapy, aby vytvořil trasu a byl mile překvapen, že to funguje bez otevřené komponenty "Naplánovat trasu". Zvolal „Jé, to jde přímo takhle?!“. Opět pro pohyb využil tlačítek na 2D mapě i osvědčené tlačítko "Zrušit trasu", když si uvědomil, že ji tvoří obráceně. Po otevření 3D mapy byl nespokojen, že to trvalo dlouho (jednalo se o verzi umístěnou na freehostingu). Naklánění mapy s mírnou nejistotou zvládl. Jak posunout mapu ho vůbec nenapadalo a jen nehnutě téměř půl minuty koukal na obrazovku. Začínal hledat v nastavení. Teprve po otevření tří záložek se přesunul k nápovědě. Tam byl zaujat první otevřenou záložkou, což byla nápověda pro 2D mapu, ale přesto v ní hledal odpověď na otázku k 3D mapě. Teprve když zrakem sjel na konec sekce o 2D mapě, uviděl nápovědu pro 3D a vítězil. Jana I.: Dopustila se překlepu "Snížkou" ve slově "Sněžkou", což vyvolalo zobrazení hlášení o chybě. Ta mírně zmenšila výhled na 2D mapu. Jana tuto hlášku nechala otevřenou a chybu opravila. Vlivem stále zobrazené hlášky a velikosti oblasti viditelné 2D mapy myslela, že chyba je stále. Po trojím kliknutí na tlačítko "Zobrazit" si tohoto jevu všimla. Při zadání bodu trasy si podle čáry i vyššího čísla právě pořízeného bodu všimla, že na mapě zůstala trasa z minula.


53

Odstraňovala jednotlivé body kliknutím na jejich ID v seznamu následované stiskem tlačítka "Odmazat bod". Netušila, že se automaticky maže poslední bod trasy a vůbec nezáleží na posledním vybrání ID. U posledního bodu scénáře se s důvěrou obrátila na nápovědu, která ji opět pomohla. Jana II.: Stejně jako v minulém scénáři našla místo prostřednictvím 2D mapy a zkušeně vytyčila trasu. Přesto tázavými pohledy vyžadovala po organizátorovi testu ujištění svého jednání. Funkci pro přesun reliéfu hledala v položkách kontextového menu a stejně jako na konci předchozího scénáře stiskla tlačítko pro posun mapy. Poté se obrátila v záhlaví na "Nastavení", kde po 30 sekundách nic nenašla. Uchýlila se k nápovědě a procházela tu pro 2D mapu, která byla výš a tudíž více na očích. Po testu přiznala, že si rozdílu mezi nadpisy "Nápověda 2D mapy" a "Nápověda 3D mapy" nevšimla. Lojza: Opět s vyhledávacím polem našel místo. Když si ve scénáři přečetl "Na 2D mapě...", stiskl tlačítko "2D mapa", čímž ji právě zavřel. Nevšiml si volby podkladu a vrhnul se proto k "Nastavení", posléze i k "Nápovědě". Až po upozornění, aby se soustředil vlevo, uviděl a bylo vše jasné. Reliéf nakláněl intuitivně. U přesunu reliéfu věděl, že šipky po stranách 3D mapy znamenají něco jiného. U zoomu si tím jistý nebyl, nepřemýšlel, co může znamenat, a rovnou jej zkusil. Po dalším ježdění kursoru myši po veškeré oblasti okna zamířil k "Nápovědě". Nevěděl, že pročítá nápovědu pro 2D mapu a hlasitě se podivoval nad tím, že přesně takové úkony dělá, ale ono se to chová jinak. Byl upozorněn, aby z nápovědy neodcházel. Pak si všiml té správné sekce nápovědy a scénář již bez problémů dokončil. Během tápání v průběhu celého scénáře párkrát stiskl tlačítko "Zpět" ve webovém prohlížeči. Eva: Použila osvědčené vyhledávací pole pro obec Pec a dokonce i pro horu Sněžku, kterou systém akceptoval. Nabídku s mapovými podklady přehlídla a přesunula se do "Nastavení", musela být směrována na prozkoumání 2D mapy. Opět vyvstal velký problém kolem vytyčení trasy, protože stále nepoužívala zoom a ani nevěděla, že se oba body nachází jen přes 3km od sebe. Neustále pro přesun mezi výchozím a cílovým bodem používala vyhledávací pole! Učinila tak asi 5krát. Mezitím se také snažila použít tlačítko "Zpět". Trasa jí pak musela být navržena organizátorem testu. Po otevření 3D mapy 10 sekund koukala a pak intuitivně zkusila uchopit 3D model myší. Největší překvapení napříč všemi testovacími uživateli nastalo u bodu e). Eva hned po přečtení zkusila kombinaci [ctrl]+myš, která fungovala. Při dotazu, jak to věděla, řekla, že jí připadá běžné, když tahle něco potřebuje, je to většinou s kombinací s [ctrl] nebo [shift] (ten v aplikaci pro tuto akci funguje také).

54


Scénář 3 Martin: Chtěl zobrazit Aš i Zlín najednou, proto neustále oddaloval zoom, až nebyly vidět názvy měst. Proto hledal a našel nastavení s názvem "Šířka mapy", kterého si všiml v rámci bloudění u předchozího scénáře. Po zvětšení mapy byl zmaten, kam zmizely záložky s nastavením. Třikrát stiskl tlačítko pro otevření/zavření komponenty s nastavením a analyzoval, co se děje. Poté sjel scollbarem dolů a s úlevou uviděl ztracené "Nastavení". Trasu pak krkolomně přes několik mezilehlých bodů i jednoho nechtěného dvojbodu v Praze vytyčil. Pro vytyčení trasy zkusil rozevřít záložku "Načíst souřadnice bodů trasy", ale hned ji zase opustil. Při rozhovoru po testu řekl, že zde čekal něco jako rozparcelovat řeku. Vytvoření trasy ani přečtení prvního bodu pro něj nepředstavovalo žádný problém. Pohyb v rámci vícestránkového seznamu bodů trasy mu připadal přirozený. Jen poslední bod trasy v prvních okamžicích hledal v horní části seznamu. Jana I.: Začala s postupným oddalováním zoomu, v průběhu čehož si uvědomila, že stačí kliknout pro vytvoření bodu trasy v jednotlivých městech i zvlášť a ne je mít zobrazena najednou. Zbytek scénáře absolvovala zcela suverénně. Jana II.: Scénář zvládla naprosto bravurně. Osvědčenými způsoby si našla výchozí město a umístila bod trasy, posula se tažením myši na cíl a po vytvoření bodu s jistotou přečetla délku trasy. Před vytvořením nové trasy vytušila, že musí první vymazat a odmazala postupně body (nepoužila "Zrušit trasu"). Naklikala novou trasu, orientovala se v dlouhém seznamu bodů trasy a zjistila požadovanou souřadnici, přestože o GPS prakticky nic neví. Lojza: Do Zlína přicestoval přes vyhledávací pole. Do Aše se přesouval na 2D mapě tlačítky a pro zoom použil kolečko myši. Délku trasy ukázal sebevědomě a s podobným nasazením si vedl u vytyčování trasy. Problém přišel s formátem "WGS dec", obrátil se na "Nastavení", pak i na "Nápovědu" a byl nervózní už z toho, že neví, co to přesně znamená. Opět několikrát použil tlačítko "Zpět", byť ani předtím nereagovalo. Až po intervenci organizátora testu, aby se vrátil na "Naplánovat trasu", uviděl hledaná písmenka a úkol byl hotov. Eva: Scénář 3 začal opět prací pro vyhledávací pole. Nebýt omylu s dvojklikem myši, možná by se v rámci bodu a) nic zápisuhodného nestalo. Dvojklik nad Zlínem způsobil umístění bodu 2 a 3. Eva se pokoušela chybu napravit přepsáním číslovky na značce bodu. Dále hledala v nastavení položky jako "Výměna pořadí bodů" apod. Až po těchto peripetiích přešla k "Odmazat bod".


55

Po úspěšném zjištění vzdálenosti nevymazala trasu, musela být na to upozorněna. Pak se hádala, kterým směrem je východ. Při vytyčování omylem umístila bod na nesprávné místo, chtěla jej zrušit (nevěděla o možnosti přesunu) a přistoupila k tlačítku "Odmazat bod". Postěžovala si, že není jasné, který bod se tím vlastně maže, přestože před chvílí s tímto tlačítkem pracovala zcela automaticky a správně. Změnu souřadnic na "WGS dec" i zbytek scénáře provedla s naprostou jistotou. Nutno dodat, že v akci "Odmazat bod" vždy předcházela snaha použít tlačítko "Zpět". Scénář 4 Martin: Odkaz zkopíroval do adresní řádky internetového prohlížeče, čímž úplně opustil 3D mapy. Až po trojím zazoomování na mapě aplikace Mapy.cz si uvědomil, že odtud výškový profil asi nezíská a hledal spásu v nápovědě (té pro Mapy.cz). Po dalším tápání byl dohlížitelem testu upozorněn, že chybu udělal hned na začátku a scénář resetoval. Nyní si správně všiml položky "Načíst trasu z url adresy" a s jistotou tam vložil url. K trase se přibližoval (tradičně) klikáním na tlačítka 2D mapy po krocích. Na dotaz po testu, jestli si všiml tlačítka "Zaměřit na mapě", odpověděl, že ano, ale nevěděl, co to je. Jana I.: Jana zadala adresu nejprve do url řádky prohlížeče, ve které omylem zanechala i část url 3D mapy. Spojením adres došlo k chybě, což Janu přivedlo k myšlence, že tudy cesta nevede. Po návratu k aplikaci vyzkoušela neprodleně zadat url do vyhledávacího pole, což přineslo kýžený výsledek. K prohlídce trasy použila funkci zoom. Jana II.: Adresu vložila do vyhledávacího pole a po zbytek scénáře se chovala jako sebejistá uživatelka. Poté se dívala a porovnávala výškové poměry v okolí své chalupy. Lojza: Po přečtení scénáře (nečekaně) zadal do vyhledávacího pole Prahu. Tušil, že se má pohybovat v "Naplánovat trasu" a pes je zakopaný asi v dolních dvou položkách. Myslel si, že se jedná o obyčejná tlačítka a použil na ně i dvojklik (čímž sekci bleskurychle otevřel a zavřel). Až po minutovém trápení prozradil, že vůbec neumí ovládat textovou schránku ([ctrl]+C, [ctrl]+V ani položky "Kopírovat" a "Vložit" v kontextové nápovědě). Po tom, co mu byl princip kopírování textu ozřejměn, dokončil scénář zdárně.

56


Eva: Zde byla největším oříškem práce s textem odkazu. Měla stále tendenci pohybovat se v menu prohlížeče. Po ukázání dvou oken internetového prohlížeče, v jednom s aplikací "Mapy.cz" a v druhém s "3D Mapy", bylo jasné, že je potřeba pracovat s url adresou, která se nachází v záhlaví prohlížeče. Metodou [ctrl]+[c] Eva odkaz umístila do schránky a pak s tázavým pohledem zkopírovala text do vyhledávacího pole aplikace. Zbytek scénáře již naštěstí nestojí za řeč.

PŘÍLOHA C: UML DIAGRAMY

C. UML diagramy C.1. Diagram nasazení a komponent – koncept

Obrázek 17: Diagram nasazení a komponent – koncept

57

58

PŘÍLOHA C: UML DIAGRAMY

C.2. Diagram nasazení a komponent – realizace

Obrázek 18: Diagram nasazení a komponent – realizace

PŘÍLOHA D: SEZNAM POUŽITÝCH ZKRATEK

59

D. Seznam použitých zkratek Zkratka

Vysvětlení

Geographic Information System – umožňuje pracovat s informacemi GIS o Zemském povrchu. Nejčastěji analyzovat a vizualizovat požadované atributy vzhledem k prostorovému umístění. GPS Global Positioning System – systém určující polohu na Zemi API

Application Programming Interface – rozhraní pro individuální tvorbu či modifikaci nabízené aplikace

CPU Central processing unit – výpočetní jádro počítačů, typicky procesor SQL

Structured Query Language – strukturovaný dotazovací jazyk sloužící k práci s relačními databázemi

DOM

Document Object Model – objektový model webového dokumentu, lze k němu přistupovat jako ke stromu

XML

Extensible Markup Language – nastavení pravidel pro kódování elektronických dokumentů

AJAX

Asynchronous JavaScript and XML – způsob komunikace mezi JavaScriptovou aplikací a serverem prostřednictvím XML

JSON JavaScript Object Notation – formát pro výměnu dat HTML HyperText Markup Language – značkovací jazyk pro hypertext CSS

Cascading Style Sheets – kaskádové styly, slouží k vytvoření podoby webové stránky

PHP Hypertext Preprocessor – programovací jazyk MIME

Multipurpose Internet Mail Extensions - internetový standard pro označení druhu dat (původně pro elektronickou poštu) Tabulka 6: Seznam zkratek

PŘÍLOHA E: ADMINISTRÁTORSKÁ PŘÍRUČKA

61

E. Administrátorská příručka Systémové požadavky: o PHP 5 o MySQL 4 Instalace: 1) Rozbalte archiv na libovolné místo, po instalaci lze tyto soubory vymazat. 2) Ze složky "install" přesuňte obsah adresáře "application" na Váš server. 3) Změňte přístupová práva ke složce "temp" na "0777". 4) Na svém MySQL serveru založte databázi "3dmapy", nad kterou spusťte skript "database.sql". 5) Ve skriptu "elevations.php" přepište "ZDE VLOŽTE..." údaji pro SQL server, username a password. 6) Na webové stránce "http://api.mapy.cz/keygen" vytvořte klíč pro server, na kterém budete aplikaci provozovat. Řiďte se pokyny stránky. Jako url zadejte cestu ve tvaru "http://[Váš server]/[Složka s aplikací 3D mapy]/index.php". 7) V hlavičce html dokumentu "index.php" změňte text "ZDE VLOŽTE NÁZEV SERVERU" na skutečný název serveru a u skriptu linkovaného z api.mapy.cz nahraďte "ZDE VLOŽTE KEY" vytvořeným klíčem.

Kontakt: Lukáš Jelínek [email protected]

http://3dmapy.unas.cz

PŘÍLOHA F: UŽIVATELSKÁ PŘÍRUČKA

F. Uživatelská příručka F.1. Úvod do aplikace Aplikace slouží k prohlížení map s ohledem na nadmořskou výšku. F.1.1. Součásti aplikace 2D mapa

3D mapa

63

64


Vyhledávací pole

Výškový profil

Naplánovat trasu

PŘÍLOHA F: UŽIVATELSKÁ PŘÍRUČKA Nastavení

Nápověda

65

66

PŘÍLOHA F: UŽIVATELSKÁ PŘÍRUČKA F.1.2. Doporučený postup 1

Nalezení požadovaného místa o použití vyhledávacího pole o manipulace s 2D mapou

2

Naplánování trasy o vytyčení na 2D mapě o načtení z url adresy o načtení souřadnic bodů trasy

3

Analýza trasy o prohlížení trasy na 3D mapě o vygenerování výškového profilu

F.2. Nápověda k záhlaví aplikace Vyhledávací pole Vyhledávací pole se nachází v záhlaví aplikace. S jeho pomocí můžete na mapě hledat obce ČR nebo zadat mapové souřadnice v podporovaných formátech. Tlačítka komponent Tlačítka komponent umožňují zobrazit požadované součásti aplikace. Z trojice tlačítek vlevo se právě vybraná komponenta (2D mapa, 3D mapa, Výškový profil) vždy vloží na první místo. Uživatel si tak může určit pořadí těchto tří komponent. Trojice vpravo (Naplánovat trasu, Nastavení, Nápověda) se chová jako přepínač, tj. z této trojice komponent je nejvýše jedna aktivní. Při deaktivaci všech se zvětší prostor pro některou z nabídky vlevo.

F.3. Nápověda 2D mapy Souřadnice aktuální pozice V dolní části se zobrazuje aktuální poloha kurzoru myši na mapě. Formát výpisu souřadnice lze změnit v nastavení. Posun mapy Pro změnu pozice na mapě levým tlačítkem myši mapu uchopte a pohybujte s ní požadovaným směrem. Případně použijte tlačítka vpravo. Přiblížení a oddálení mapy Pro změnu přiblížení použijte kolečko myši nebo panel v pravé části mapy. Přidání bodu trasy Klikněte levým tlačítkem myši na místo, kde si přejete umístit bod trasy. Přesun bodu trasy Uchopte levým tlačítkem myši značku bodu trasy a tažením ji přesuňte na požadovanou novou pozici.


67

F.4. Nápověda 3D mapy Otáčení a naklánění mapy Stiskněte levé tlačítko myši a táhněte, kam chcete mapu naklonit. Přiblížení a oddálení mapy Pro změnu vzdálenosti od mapy použijte kolečko myši nebo klávesy +/- či w/s. Posun mapy ve scéně Pro změnu polohy mapy stiskněte klávesu ctrl, levým tlačítkem myši uchopte mapu a pohybujte s ní požadovaným směrem.

F.5. Nápověda k výškovému profilu Výškový profil je graf závislosti nadmořské výšky na vzdálenosti od výchozího bodu trasy. Některé jeho vlastnosti lze upravit v Nastavení.

F.6. Nápověda pro naplánování trasy Tato funkce je soustředěna na komponentě Naplánovat trasu. Jak vytyčit trasu na mapě K vytyčení na 2D mapě slouží 2D mapa, na kterou můžete kliknutím levého tlačítka myši umístit body trasy. Jak načíst trasu z url adresy Do formulářového pole na záložce Načtení trasy z url adresy vložte webovou adresu s parametry popsanými tamtéž. Jak načíst souřadnice bodů trasy Do formulářového pole na záložce Načtení souřadnic bodů trasy souřadnicové hodnoty bodů trasy popsanými tamtéž.

F.7. Jak řešit chyby a problémy Co dělat v případě potíží Omlouváme se, pokud jste okolnostmi nucen(a) číst tyto řádky. Prosím, řiďte se následujícím postupem v uvedeném pořadí. 1. Přečtěte si znovu chybovou hlášku a uvažujte, jak jejímu zobrazení předejít. 2. Zkuste úkon znovu. 3. Najděte si v nápovědě pasáže, které se problému mohou týkat. 4. Kontaktujte tvůrce programu, jehož e-mail se nachází v pasáži O aplikaci.

68

PŘÍLOHA F: UŽIVATELSKÁ PŘÍRUČKA Proč mám čekat? Aplikace je závislá na výškových datech ze serveru v Americe, který tato data poskytuje bezplatně a neručí za rychlost odezvy, ani za dostupnost služby jako takové. Mějte, prosím, proto strpení i Vy s naší bezplatnou aplikací. Avšak díky Vaší aktivitě spojené s automatickým kopírováním "vyčekaných" dat na aplikační server se do budoucna několikanásobně zkrátí čekání u často navštěvovaných lokalit. Děkujeme Vám.

F.8. O aplikaci Tvůrce Lukáš Jelínek [email protected]

http://3dmapy.unas.cz

Systémové požadavky Funkčnost v prohlížečích: Mozilla Firefox 3.6.3

Bezproblémový chod

Google Chrome 4.1.249


Safari 4.0.5


Opera 10.51

Vyšší zátěž na paměť

MS Internet Explorer 8

Nepodporuje vůbec!

Pro běh aplikace stačí běžné kancelářské PC: • procesor 1.6GHz • 512MB RAM Poděkování Děkuji firmě Seznam.cz za komponenty nezbytné pro běh aplikace a profesoru FEL ČVUT RNDr. Marko Genyk-Berezovskému za podporu.

PŘÍLOHA G: OBSAH PŘILOŽENÉHO CD

69

G.Obsah přiloženého CD Velká část obsahu je též k dispozici veřejně na webové stránce http://3dmapy.unas.cz. Chybí tam pouze aplikace samotná, protože by svým otevřeným publikováním porušovala licenční podmínky dohodnuté v rámci projektu.

Název souboru/složky

Popis

Dokumentace projektu

dokument spisek.pdf

Tato zpráva ve formátu pdf

spisek.odt

Tato zpráva ve formátu odt

spisek.doc

Tato zpráva ve formátu doc

install.zip

Administrátorská instalace

logo

Soubory loga 3D Mapy

src

Zdrojové kódy aplikace application

Soubory aplikace

doc_php

Vygenerovaná dokumentace PHP

database.sql

SQL skript pro vygenerování databáze

readme_files

Podpůrné soubory readme.htm

readme.htm

Podrobné informace o CD. Tabulka 7: Obsah přiloženého CD

– konec dokumentu –

Diplomová práce. Lukáš Jelínek. Vedoucí práce: RNDr. Marko Genyk-Berezovskyj

Recommend Documents