<p id='prepend'>Vector Markup Language (VML) umo₧≥uje vytvß°enφ vektorovΘ grafiky. Mo₧nß vφte, ₧e k prakticky stejnΘmu ·Φelu slou₧φ SVG, v dob∞ vzniku VML vÜak jeho standardizace byla v nedohlednu. Microsoft se rozhodl popohnat v∞ci kup°edu a tak se stal VML jedin²m vektorov²m formßtem s nativnφ podporou v prohlφ₧eΦi www strßnek.</p>
<p>VML pou₧φvß syntaxi XML, tudφ₧ se velmi podobß HTML. Stejn∞ jako HTML popisuje vlastnosti textu, tak VML popisuje grafiku. Pomocφ vektor∙ (liniφ a k°ivek), vytvß°φ novΘ tvary, k jejich₧ formßtovßnφ vyu₧φvß CSS. Proto₧e vÜak jde o proprietßrnφ technologii Microsoftu, je zatφm jeho podpora implementovßna jen do MSIE5+, nicmΘn∞ v jin²ch prohlφ₧eΦφch nep∙sobφ ₧ßdnΘ potφ₧e, jednoduÜe se nezobrazφ. VML lze p°itom vytvß°et jak v aplikacφch Microsoftu (Office2000 a vyÜÜφ), tak v aplikacφch jin²ch spoleΦnostφ, jednou z poslednφch je nap°φklad program AutoCAD map 2004.</p>
<h3>V²hody VML oproti jin²m typ∙m grafiky</h3>
<p>Mo₧nß vßs napadne otßzka, proΦ pou₧φvat VML, kdy₧ si lze vÜe nakreslit v n∞jakΘm bitmapovΘm editoru. Vytvß°enφ VML grafiky jako takovΘ m∙₧e b²t trochu slo₧it∞jÜφ proces (zßle₧φ na tom, co chcete nakreslit), ale p°eci jen je tu n∞kolik nesporn²ch v²hod:</p>
<div class='list'>
<ul>
<li><strong>Manipulace</strong> - pokud jste cht∞li zm∞nit text nebo barvu obrßzku, museli jste si ho otev°φt v grafickΘm editoru a tam provΘst zm∞ny. Manipulace s prvky VML je v tomto p°φpad∞ mnohem snazÜφ, zm∞ny textu, barvy, velikostφ se provßd∞jφ p°φmo ve zdrojovΘm k≤du strßnky.</li>
<li><strong>Interpretace textu</strong> - proto₧e text ve VML grafice je tvo°en pomocφ HTML, je i nadßle interpretovßn jako text a ne jako bitmapa. Takov² text je potom mo₧nΘ kopφrovat a je vid∞t ve zdrojovΘm k≤du (tak₧e ho mohou indexovat vyhledßvaΦe a podobn∞).</li>
<li><strong>CSS</strong> - nabφzφ spoustu vlastnostφ, kter²mi m∙₧ete grafiku m∞nit. Proto₧e podpora je zajiÜt∞na a₧ od MSIE5, je mo₧nΘ pou₧φt k dopln∞nφ vizußlnφch efekt∙ filtry CSS.</li>
<li><strong>DHTML</strong> - prohlφ₧eΦe podporujφcφ dynamickΘ HTML mohou VML grafiku v zßvislosti na okolnφch podmφnkßch m∞nit k nepoznßnφ. M∙₧ete vytvß°et grafy, animace a podobn∞.</li>
<li><strong>Poloha objekt∙</strong> - objekty VML nemusφ b²t vykresleny v takovΘm po°adφ, v jakΘm jsou zapsßny ve zdrojovΘm k≤du. S pomocφ CSS nenφ problΘm m∞nit jejich pozice. Ka₧d² spoj liniφ v grafice mß p°esn∞ danΘ sou°adnice, kterΘ je mo₧no m∞nit.</li>
<li><strong>MenÜφ datov² objem</strong> - samotnß vektorovß grafika je mΘn∞ objemnß ne₧ jejφ ekvivalent v bitmap∞. Navφc VML vystupuje pouze jako jeden nebo vφce XML element∙, proto je velikost grafiky srovnatelnß s textem. Pouze jejφ naΦφtßnφ je trochu pomalejÜφ ne₧ naΦtenφ textu.</li>
<li><strong>RozliÜenφ</strong> - odpadßvajφ problΘmy zp∙sobenΘ rozliÜenφm prohlφ₧eΦe. VML grafice m∙₧ete nastavit libovolnou velikost ani₧ by doÜlo ke zkreslenφ. To ocenφte t°eba p°i zv∞tÜovßnφ Φßsti mapy.</li>
<li><strong>Samostatnost objekt∙</strong> - objekty vystupujφ ve strßnce samostatn∞, nejsou propojeny. Tuto vlastnost m∙₧ete vyu₧φt p°i tvorb∞ klikacφch map nebo animacφ.</li>
<li><strong>Kompatibilita</strong> - proto₧e VML je zalo₧eno na XML, je kompatibilnφ s jin²mi XML aplikacemi a nenφ problΘm do vlastnφ aplikace podporu VML integrovat.</li>
</ul>
</div>
<h3>Zßpis VML</h3>
<p>VML je znaΦkovacφ jazyk tak jako HTML. Ale rozdφl mezi VML a HTML je zcela zßsadnφ. Zatφmco HTML ve v∞tÜin∞ p°φpad∙ jen formßtuje obsah, VML obsah formßtuje a zßrove≥ i vytvß°φ. P°esto platφ, ₧e tvorba VML je ·pln∞ stejnß jako tvorba HTML. Bohat∞ si p°itom vystaΦφte s textov²m editorem a prohlφ₧eΦem. VeÜkerß data tvo°φ elementy a jejich atributy, kterΘ popisujφ, jak majφ b²t linie pospojovßny a formßtovßny. Samotnß grafika se v dokumentu chovß jako inline prvek (chovß se stejn∞ jako element <span>), nijak se od ostatnφho textu neodsazuje a zabφrß pouze vymezen² prostor. VML se pou₧φvß p°edevÜφm k tvorb∞ dynamickΘ grafiky, ale stejn∞ dob°e mohou b²t prvky VML pou₧ity jako navigaΦnφ tlaΦφtka, Üipky a mnoho dalÜφch v∞cφ.</p>
<h3>Formßt strßnky s VML</h3>
<p>Dost bylo teorie, te∩ se podφvßme na samotnou grafiku. Ne₧ zaΦneme kreslit, je nutnΘ pozm∞nit v dokumentu pßr v∞cφ. VML je zalo₧eno na XML a proto je t°eba deklarovat p°φsluÜnΘ <em>namespace</em> a <em>behavior</em> v hlaviΦce dokumentu. Nßsledujφcφ °ßdky jsou nutnΘ, aby prohlφ₧eΦ poznal, ₧e budeme pracovat s VML:</p>
<p>Ve VML, podobn∞ jako v jin²ch formßtech, je definovßno n∞kolik zßkladnφch tvar∙, jejich₧ tvorba je zjednoduÜena do urΦitΘho schΘmatu. Pro p°φklad si ukß₧eme, jak se definuje obdΘlnφk (Φtverec).</p>
<p>Jak m∙₧ete vid∞t nφ₧e, v p°φpad∞ obdΘlnφku je nejprve uvedena syntaxe XML <samp>v:rect</samp>, kterß urΦuje, o kter² z p°eddefinovan²ch tvar∙ jde. Dßle najdeme nastavenφ velikosti pomocφ CSS. Atribut <samp>fillcolor="barva"</samp> nastavuje barvu v²pln∞. V druhΘm p°φklad∞ se navφc nachßzφ text formßtovan² pomocφ HTML. Tato ukßzka mluvφ za vÜe. VML mß stejnou strukturu jako XML, je na n∞j mo₧nΘ aplikovat kaskßdovΘ styly CSS a jeho obsahem m∙₧e b²t HTML.</p>
<span class='note-author'>Pokud dosadφte za poΦßteΦnφ ·hel "0" a za koncov² ·hel "360", vykreslφ se kru₧nice. A pokud dosadφte "0" a "900", kruh se dva a p∙l krßt obtoΦφ - v²sledkem je obrßzek vpravo.</span>
<li><em><v:shape></em> - nastavuje barvy, ohraniΦenφ a velikost zatφm neznßmΘho tvaru</li>
<li>atribut <em>coordsize</em> - nastavuje poΦßtky osy x a y</li>
<li>atribut <em>coordsize</em> - nastavuje velikost objektu</li>
<li><em><v:shape></em> urΦuje body, kter²mi bude linie postupn∞ prochßzet. Sou°adnice <em>m 30,0l</em> je poloha prvnφho bodu tvaru (x=30,y=0), sou°adnice <em>0,15x e</em> je poloha poslednφho bodu, kter² bude spojen s prvnφm. V₧dy dvojice po poΦßteΦnφm bodu tvo°φ polohu bodu, kter² bude spojen s p°edchozφm a nßsledujφcφm.</li>
</ul>
</div>
<h3>Poloha objekt∙</h3>
<p>Ji₧ jsem zmφnil, ₧e VML grafika se chovß jako element <span>. V₧dy se zadßvß pozice bodu, kter²m bu∩ linie (k°ivka) prochßzφ, nebo body, kde vektor zaΦφnß a konΦφ. Co se t²Φe jejich pozice, nejde o absolutnφ pozice vzhledem ke strßnce (tu je mo₧nΘ takΘ nastavit pomocφ CSS), ale vzhledem k objektu VML, kdy lev² hornφ roh grafiky mß pozici [0,0], sm∞rem dol∙ a doprava se pozice zvyÜuje (soustava sou°adnic obrßcenß vzh∙ru nohama), viz obrßzek:</p>
<p>Äe je VML vyu₧itelnΘ i v praxi, dokazuje nßsledujφcφ <a href='podklady/grimmich/755/ukazka.htm'>sloupcov² graf</a>, k jeho₧ vytvo°enφ bylo pou₧ito spojenφ JavaScriptu a VML.</p>
<div class='refer'>
<h3>DalÜφ zdroje</h3>
<ul>
<li><a href='http://www.w3.org/TR/NOTE-VML'>W3C VML specifikace</a> - p°ehledn∞ a anglicky</li>
<li><a href='http://interval.cz/__redirect/redirect.asp?what=interval_offline&url=http://interval.cz/clanek.asp?article=3176'>E-mailov² klient pre webmail v PHP - odosielanie, Φφtanie a s¥ahovanie</a></li>
<li><a href='http://interval.cz/__redirect/redirect.asp?what=interval_offline&url=http://interval.cz/clanek.asp?article=3174'>Strßnkovßnφ v ovlßdacφm prvku DataGrid</a></li>
<li><a href='http://interval.cz/__redirect/redirect.asp?what=interval_offline&url=http://interval.cz/clanek.asp?article=1312'>Statistika p°φstup∙ v PHP - vyhledßvacφ frßze</a></li>
<li><a href='http://interval.cz/__redirect/redirect.asp?what=interval_offline&url=http://interval.cz/clanek.asp?article=3165' title='(34 komentß°∙)'>Nßh╛ady k obrßzkom generovanΘ v PHP</a></li>
<li><a href='http://interval.cz/__redirect/redirect.asp?what=interval_offline&url=http://interval.cz/clanek.asp?article=3166' title='(25 komentß°∙)'>Maguma Studio - freeware editor PHP skriptov</a></li>
