3 MOŽNÉ PŘÍSTUPY K TVORBĚ APLIKACÍ NAD SVG DOKUMENTY

Rozměr: px

Začít zobrazení ze stránky:

Download "3 MOŽNÉ PŘÍSTUPY K TVORBĚ APLIKACÍ NAD SVG DOKUMENTY"

Jozef Tichý
před 7 lety
Počet zobrazení:

1 3 MOŽNÉ PŘÍSTUPY K TVORBĚ APLIKACÍ NAD SVG DOKUMENTY 3.1 Tenký a tlustý klient Klientské aplikace nad XML dokumenty v prostředí internetu se dají rozdělit na dvě skupiny: tenký klient a tlustý klient. Tenký klient je označení takových aplikací, u nichž se na straně klienta vykonává minimum aplikační logiky a většina se vykonávána na straně serveru. U tlustého klienta je tomu přesně naopak. Tlustý klient tak klade větší hardwarové i softwarové nároky na klienta, tenký naopak na stranu serveru a na komunikaci. Tlustý klient má většinou nižší objem přenesených dat než tenký klient. Rozdělení klientských aplikací na tenkého a tlustého klienta není striktní, řada aplikací je na pomezí těchto skupin. Většina současných klientských aplikací využívajících SVG a pracujících se skriptováním jsou typickými příklady tlustých klientů. Postup bývá následující: 1. Klient pošle serveru požadavek o zaslání webové stránky (v tomto případě SVG dokumentu) 2. Server pošle uživateli všechna data a skripty (v jazyce ECMAScript). 3. Klient zobrazí SVG dokument za pomocí prohlížeče SVG a provádí nad ním veškerou funkcionalitu definovanou v přiložených skriptech. Typickým příkladem tlustého klienta v oblasti webové kartografie jsou mapové aplikace vygenerované softwarem CeoClient (extenze pro program ArcView od společnosti ESRI, Pomocí softwaru GeoClient je jednorázově vygenerována mapa v podobě SVG dokumentu a příslušné skripty (v jazyce ECMAScript). Pokud se tento dokument spolu se skripty umístí na server, server zašle klientovi tyto soubory a vše ostatní se odehrává na straně klienta (zvětšování/zmenšování/posun mapy, vypínání mapových vrstev apod.). Tento přístup se hodí pro mapy malého rozsahu a malého obsahu. V okamžiku, kdy je obsah nebo rozsah mapy příliš velký, roste objem přenesených dat a především se neúnosně zpomaluje vykreslování mapy na straně klienta. Tento problém řeší AJAX (Asynchronous JavaScript And XML), což je označení několika technologií použitých za určitým cílem. Technologiemi jsou většinou XML nebo HTML, DOM, ECMAScript a objekt XMLHttpRequest (viz dále), cílem je asynchronní výměna dat

2 mezi serverem a webovým prohlížečem. Asynchronní výměnou dat je myšlena výměna dat mezi serverem a webovým prohlížečem bez znovunačtení (reload) celé stránky (resp. celého SVG dokumentu). Postup probíhá většinou takto: 1. Klient pošle serveru požadavek o zaslání webové stránky (v tomto případě SVG dokumentu) 2. Server pošle uživateli základní kostru SVG dokumentu a skripty (v jazyce ECMAScript). 3. Klient získává potřebná data až v okamžiku, kdy je opravdu potřebuje, a sice asynchronní výměnou dat. V oblasti webové kartografie se to dá představit třeba tak, že server pošle klientskému webovému prohlížeči pouze kostru mapy ve formě SVG dokumentu a webový prohlížeč si pak asynchronně nahraje pouze ty mapové vrstvy, které jsou aktuálně zobrazené. Další mapové vrstvy si nahraje až v okamžiku, kdy je uživatel bude chtít zobrazit. Mapové vrstvy předává server v podobě speciálně strukturovaného XML dokumentu. Webový prohlížeč tento XML dokument načte a vloží na předdefinované místo ve stromové struktuře SVG dokumentu (stránky). K asynchronní výměně dat slouží objekt XMLHttpRequest, který umožňuje pomocí svých metod zaslat požadavek z webového prohlížeče serveru, přijmout od něj data ve formě XML dokumentu a zpracovat je. Objekt XMLHttpRequest je plně podporován prohlížeči Mozilla Firefox a Opera, u zásuvného modulu Adobe SVG Viewer a u prohlížeče Squiggle (Batik) je třeba použít obdobnou funkci GetURL spolu s funkcí parsexml (více viz [NeuWin 2005]). Aplikace, které využívají AJAX, většinou leží na pomezí tenkých a tlustých klientů, kdy část aplikační logiky vykonává klient a část server. Příkladem takové aplikace v oblasti webové kartografie může být např. jedna z variant softwaru MapViewSVG od společnosti Uismedia ( která ve svých interaktivních mapových aplikacích založených na SVG využívá právě AJAX. Aplikace využívající AJAX se jeví jako lepší a komplexnější řešení, protože spojují výhody tenkých a tlustých klientů, jsou však náročnější na vytvoření, protože kromě klientských skriptů je potřeba naprogramovat i skripty serverové. Jejich požadavkem je tedy také nadstandardní podpora ze stranu serveru, který musí podporovat nějaký programovací jazyk (např. výše zmíněný jazyk PHP)

3 Aplikace, u nichž by se všechna aplikační logika prováděla na straně serveru, se na poli interaktivních mapových aplikací nad SVG dokumenty nevyskytují jednoduše proto, že by tím byla omezena uživatelská interaktivita. Příkladem podobné aplikace z jiného prostředí může být např. práce M. Vaňka [Vaněk 2004], kdy server na dotaz klienta vygeneruje z XML dokumentu se statistickými daty pomocí XSLT transformací výsledný SVG dokument s příslušným grafem. 3.2 SVG a XHTML Klientské aplikace pracující s SVG lze budovat: nad čistými SVG dokumenty nad kombinací XHTML a SVG dokumentů, tzv. vnořené (inline) SVG nad XHTML dokumenty, z nichž je odkazováno na externí SVG dokumenty. Každý z těchto přístupů má své výhody a nevýhody Čisté SVG dokumenty Aplikace nad čistými SVG dokumenty mají svou výhodu především v tom, že je dokáže zobrazit i prohlížeč, který nedokáže zpracovat kombinaci XHTML a SVG. Nevýhody jsou dvě. První nevýhodou je, že případný text se musí formátovat pomocí SVG (formátování textu je v SVG nedostačující viz podkapitolu 2.2.3). Druhá nevýhoda se týká toho, že SVG dokument nelze rozdělit na více dílčích externích SVG dokumentů. Např. u mapy ve formátu SVG by nebylo špatné, kdyby se z hlavního SVG dokumentu odkazovalo na dílčí externí SVG dokumenty, kterými by byly např. mapové okno, legenda, přehledová mapa atd. Toto však v čistém SVG udělat nelze (resp. lze, ale bez možnosti skriptování externích SVG dokumentů). Lze to ovšem obejít vytvářením dílčích výkresů pomocí elementu svg uvnitř jednoho SVG dokumentu

4 3.2.2 Kombinace XHTML a SVG, tzv. vnořené SVG (inline SVG) Kombinace XHTML a SVG je myšlenka, která stála u zrodu standardu SVG. Jedná se o to, že SVG elementy by se vkládaly přímo do XHTML dokumentu. Tuto kombinaci ovšem dokáže zobrazit jen několik prohlížečů (Mozilla Firefox a další viz podkapitolu 2.2.3). Existuje způsob, jakým lze donutit ke zobrazení této kombinace i prohlížeč Microsoft Internet Explorer se zásuvným modulem Adobe SVG Viewer (popsaný např. zde [Hejral 2006]), ovšem s jedním zásadním omezením události lze přiřazovat pouze kořenovému elementu SVG grafiky, ne jeho vnořeným elementům. Kombinaci XHTML a SVG umí zobrazit i prohlížeč Amaya, který ovšem nepodporuje skriptování. Výhodou kombinace XHTML a SVG je, že text může být formátován pomocí XHTML v kombinaci s CSS, které k tomu nabízí mnohem lepší prostředky. Nevýhodou je, že korektní využití této kombinace s plně zachovanými možnostmi skriptování dovoluje pouze prohlížeč Mozilla Firefox a jemu podobné. Podobně jako v předchozím případě nelze SVG grafiku rozdělit do více dílčích externích SVG dokumentů XHTML a externí SVG Z XHTML dokumentu se dá na externí SVG dokumenty odkazovat pomocí elementu object, v případě prohlížeče Microsoft Internet Explorer je vhodnější použít element embed (viz [Hejral 2006]). Při tomto přístupu je možné pomocí modelu DOM přistupovat i k externím SVG dokumentům, možnosti skriptování jsou tedy plně zachovány. Výhodou tohoto přístupu je, že text lze částečně formátovat v XHTML a že lze SVG grafiku rozdělit na více dílčích externích SVG dokumentů. Nevýhodou je, že tento dokument nezobrazí prohlížeče, které znají pouze SVG, např. Squiggle (Batik). Mozilla Firefox a prohlížeče se zásuvným modulem Adobe SVG Viewer by takovýto dokument měly zobrazit korektně (i se skriptováním). Pro aplikace pracující s SVG a využívající skriptování je nevhodný druhý přístup, který kombinuje XHTML a SVG elementy, především pro jeho nízkou podporu v prohlížečích. První a třetí způsob se dají označit jako vhodné. První způsob čisté SVG se hodí spíše pro aplikace, které nepotřebují složitější formátování textu. Na to je naopak dobrý třetí způsob

5 XHTML a externí SVG dokumenty jehož nevýhodou je, že jej nepodporuje multiplatformní SVG prohlížeč Squiggle (Batik)

Podobné dokumenty

1. Úvod do Ajaxu 11. Jak Ajax funguje? 13

1. Úvod do Ajaxu 11. Jak Ajax funguje? 13 Obsah Úvodem 9 1. Úvod do Ajaxu 11 Jak Ajax funguje? 13 Popis 13 Ukázky 13 Jaké jsou možnosti tvorby interaktivních webových aplikací? 15 Co je třeba znát? 16 Jak fungují technologie Ajaxu 16 Jak funguje