Interval.cz

Pr∙vodce SVG - zobrazenφ vektorovΘ grafiky v prohlφ₧eΦi Opera

V tomto Φlßnku se podφvßme podrobn∞ji, jak to vlastn∞ je s podporou nativnφho zobrazovßnφ vektorovΘ grafiky SVG-XML v osmiΦkovΘ verzi webovΘho prohlφ₧eΦe Opera. A abychom uspokojili vÜechny "nev∞°φcφ TomßÜe", tak si rovnou pßr p°φklad∙ vyzkouÜφme.

O co tedy vlastn∞ jde? Budu postupn∞ probφrat nejasnosti, je₧ se objevily v diskuzi k p°edchozφmu Φlßnku. Pokusφm se p°ehledn∞ shrnout d∙le₧itß fakta a p°esn∞ vysv∞tlit, proΦ je Opera 8 skuteΦn∞ prvnφm webov²m prohlφ₧eΦem s podporou normy SVG Tiny.

Kdo je vlastn∞ prvnφ?

V p°edchozφm Φlßnku jsem napsal: Prvnφm webov²m prohlφ₧eΦem s ·plnou podporou formßtu SVG Tiny (tedy vΦetn∞ SMIL animacφ!) nenφ ani Mozilla, ani Konqueror, n²br₧... Opera!

Pro toto tvrzenφ existuje hned n∞kolik d∙vod∙. Mozilla (a Firefox) nenφ prvnφ jednoduÜe proto, ₧e implementace SVG v nφ je zatφm zoufale nekompletnφ (lokßlnφ kopie), to je realita, kterou nezm∞nφ ani mΘ sympatie k tomuto projektu. I o programu Amaya jsme ji₧ psali. Tento program bohu₧el v souΦasnΘ podob∞ nenφ pou₧iteln² pro b∞₧nΘ laickΘ u₧ivatele internetu a jeho implementace SVG rovn∞₧ nenφ ·plnß. Co se t²Φe prohlφ₧eΦe Opera 8b3, d∙kazem kvality implementace normy SVG Tiny v tomto prohlφ₧eΦi budi₧ zkouÜka na vlastnφ oΦi.

Norma SVG

Asi bude lΘpe, kdy₧ si nynφ p°ipomeneme, co p°esn∞ p°edstavujφ pojmy SVG Basic (SVGB) a SVG Tiny (SVGT).

Oba profily byly vyvinuty jako podmno₧iny normy SVG (n∞kdy se uvßdφ tΘ₧ SVG Full) specißln∞ pro pot°eby dynamicky se rozvφjejφcφ oblasti mobilnφch poΦφtaΦov²ch a komunikaΦnφch za°φzenφ (PDA, mobily a podobn∞), kterß v souΦasnosti majφ oproti osobnφm poΦφtaΦ∙m v²razn∞ ni₧Üφ v²poΦetnφ v²kon a kapacitu pam∞ti.

Podle mΘho nßzoru lze rozd∞lenφ standardu SVG Full v²born∞ pou₧φt taktΘ₧ p°i programovßnφ prohlφ₧eΦ∙ - kompletnφ SVG mß obrovskΘ schopnosti, kter²m odpovφdß slo₧itost algoritm∙, je₧ je nutnΘ napsat. Oproti tomu, naprogramovat SVGT je relativn∞ snadnΘ...

Profil SVG Basic je subset SVG normy urΦen² primßrn∞ pro PDA - vypuÜt∞ny jsou filtry a zjednoduÜena je implementace o°ezov²ch cest.

V profilu SVG Tiny urΦenΘm pro mobilnφ telefony k nepodporovan²m prvk∙m p°ib²vajφ skripty, p°echody barev, v²pl≥ovΘ vzorky, pr∙hlednost, o°ezßvßnφ a maskovßnφ kompletn∞, elementy tspan, tref (z∙stßvß v podstat∞ pouze zßkladnφ text), CSS formßtovßnφ a symboly.

Jak roste v²konnost hardwaru, doÜlo ve verzi SVG Tiny 1.1 k mφrnΘmu rozÜφ°enφ grafick²ch schopnostφ - p°idßna byla mimo jinΘ i pr∙hlednost (ale jen na ·rovni skupin). Rovn∞₧ schopnosti SVG Basic 1.1 se pon∞kud rozÜφ°ily o n∞kterΘ filtry.

Nativnφ SVG v Mozille

N∞kte°φ ji₧ mo₧nß Φetli komentß° k jednomu z p°edchßzejφcφch Φlßnk∙ , kde se v odstavci "Nativnφ podpora ve webov²ch prohlφ₧eΦφch" a "V²slednß realita" m∙₧ete dozv∞d∞t vφce.

Nejv∞tÜφ mezerou projektu Mozilla SVG je v souΦasnosti p°edevÜφm absence SMIL animacφ. Pro zßjemce m∙₧e b²t zajφmavß aktußlnφ odpov∞∩ prezidentky Mozilla Foundation na p°φm² dotaz ohledn∞ podpory SVG (viz Slashdot: Mozilla Foundation Chief Mitchell Baker Replies).

Jako polehΦujφcφ okolnost mohu v²vojß°∙m Mozilly p°iznat to, ₧e si vytyΦili pom∞rn∞ vysok² cφl, toti₧ integraci XHTML s SVG v jednom jedinΘm XML souboru (objektovΘm stromu). Vyu₧φvß se p°itom normalizovanΘho mechanizmu p°epφnßnφ jmenn²ch prostor∙ XML. Myslφm, ₧e i bez znalosti XML nßsledujφcφ p°φklad vysv∞tluje vÜe:

N∞co podobnΘho umφ v souΦasnosti krom SVG-Mozilly u₧ jen Amaya.

Podpora SVG ze strany Microsoftu

V diskusi se objevila i zmφnka o implementaci v Microsoft Internet Exploreru. Podle mn∞ znßm²ch fakt∙, o kter²ch jsem v p°edchozφch Φlßncφch rovn∞₧ ji₧ psal (viz "Desktop SVG" a "XAML"), zodpov∞dn∞ prohlaÜuji, ₧e dotyΦnß firma, bohu₧el, s nejvyÜÜφ pravd∞podobnostφ SVG v dalÜφ generaci MSIE (OS Longhorn) podporovat nebude. D∙vody, kter²mi to jejφ lidΘ vysv∞tlujφ, jsou sice pon∞kud nesmyslnΘ, ale nenφ to poprvΘ, co n∞co podobnΘho v poΦφtaΦovΘ bran₧i za₧φvßme.

Opera 8 - reßlnΘ zobrazenφ interaktivnφ vektorovΘ grafiky SVG

P°edevÜφm znovu opakuji: "Ano, Opera 8 skuteΦn∞ umφ vykreslit vÜechny grafickΘ a animaΦnφ prvky obsa₧enΘ v norm∞ SVG Tiny 1.1." Ne₧ budete Φφst nßsledujφcφ odstavce, jeÜt∞ jednou tedy p°ipomφnßm definici SVG Tiny, uvedenou v²Üe v tomto textu.

Omlouvßm se Φtenß°i, kter² v diskusi k p°edchozφmu Φlßnku p°irovnßvß betaverzi Opery 8 k v²vojovΘmu buildu Mozilly, ale musφm b²t zßsadn∞ proti. Implementace SVG v projektu Mozilla, jak u₧ jsem zmφnil v²Üe, je v souΦasnosti ·pln∞ n∞kde jinde, zatφmco Opera 8 ji₧ nynφ disponuje prov∞°en²m zobrazovacφm jßdrem firmy Ikivo s implementacφ celΘ normy SVG Tiny 1.1.

Co se t²Φe nestability Opery 8b3 - skuteΦn∞ obΦas dochßzφ k pßd∙m programu - t²kß se to p°edevÜφm animacφ, kterΘ vyu₧φvajφ prvky mimo SVG Tiny (jako t°eba textury, o°ezßvßnφ, maskovßnφ). To snad lze betaverzi odpustit. N∞kterΘ funkΦnφ animace z naÜeho kurzu:

1. demonstrace parametr∙ animaΦnφch element∙
2. vliv atributu "additive"
3. vliv atributu "combine"
4. interaktivnφ spouÜt∞nφ animacφ
5. skokovß vs lineßrnφ animace
6. °φzenφ zrychlenφ
7. rolovßnφ
8. animace kru₧nic - kombinace animaΦnφch prvk∙

Animace pφsmenek

Tato animace pφsmenek, kterou ji₧ znßte z jednoho Φlßnku naÜeho v²ukovΘho serißlu SVG, p∙vodn∞ obsahovala nekompatibilnφ prvek tspan a pr∙hlednosti - to vÜe jsem odstranil a nahradil prvky text bez pr∙hlednosti.

Specifikace SVG Tiny a Basic podrobn∞

Specißln∞ pro Φtenß°e Intervalu jsem jeÜt∞ sestavil p°ehlednou tabulku, je₧ podrobn∞ji ukazuje, kterΘ vlastnosti SVG jsou vypuÜt∞ny v podmno₧inßch SVGT a SVGB. Upozor≥uji, ₧e v²Φet nenφ zcela vyΦerpßvajφcφ, obsahuje to, co jsem pova₧oval za nejd∙le₧it∞jÜφ. ┌plnou informaci naleznete samoz°ejm∞ v originßlnφ specifikaci W3C.

Vyhledßvßnφ