<meta http-equiv='pics-label' content='(pics-1.1 "http://www.icra.org/ratingsv02.html" comment "ICRAonline EN v2.0" l gen true for "http://interval.cz" r (nz 1 vz 1 lz 1 oz 1 cz 1) "http://www.rsac.org/ratingsv01.html" l gen true for "http://interval.cz" r (n 0 s 0 v 0 l 0))' />
<p id='prepend'>Tento Φlßnek o grafickΘm formßtu SVG bude tak trochu specializovßn na platformn∞ nezßvislΘ aplikace b∞₧φcφ v prost°edφ Java. ZaΦneme kup°φkladu zajφmav²m grafick²m editorem formßtu SVG-XML a skonΦφme nßvodem, jak umo₧nit nßvÜt∞vnφk∙m webov²ch strßnek prohlφ₧et SVG grafiku bez nutnosti instalovat prohlφ₧eΦ.</p>
<p>P°iznßvßm se bez muΦenφ, ₧e jsem se a₧ doposud ·mysln∞ vyh²bal javovsk²m program∙m, p°edevÜφm kv∙li ni₧Üφmu v²konu oproti nativnφm aplikacφm. Vzφt vßs na exkurzi do tΘto oblasti mne p°im∞lo vφce faktor∙:</p>
<ol>
<li>I ten nejlevn∞jÜφ dnes vyrßb∞n² poΦφtaΦ disponuje dostaΦujφcφm v²konem.</li>
<li>JavovskΘ programy jsou absolutn∞ nezßvislΘ na operaΦnφm systΘmu poΦφtaΦe.</li>
<li>V neposlednφ °ad∞ prost°edφ Java samo, i aplikace zajφmavΘ pro SVG grafiku, ji₧ dosp∞ly a vyzrßly do velmi sluÜn∞ pou₧itelnΘ podoby.</li>
</ol>
<p>Nynφ vßm nabφzφm mal² trik pro pohodlnΘ spouÜt∞nφ javovsk²ch aplikacφ v prost°edφ Unixu (Linux, MAC OSX). P°edpoklßdejme, ₧e si aplikace Javy rozbalφte do adresß°e <samp>/usr/java/</samp>. Pak si m∙₧ete do adresß°e se spustiteln²mi programy (nap°φklad <samp>/usr/local/bin/</samp>) umφstit nßsledujφcφ skript pro spouÜt∞nφ SVG prohlφ₧eΦe z Batiku:</p>
<p>Sketsa pou₧φvß SVG jako sv∙j p°irozen² grafick² datov² formßt. Je zalo₧en na otev°enΘ, voln∞ dostupnΘ grafickΘ knihovn∞ Batik, na kterou jeÜt∞ p°ijde °eΦ dßle v tomto textu. Te∩ u₧ nikoho nep°ekvapφ sd∞lenφ, ₧e grafickΘ schopnosti odpovφdajφ schopnostem renderovacφho jßdra dotyΦnΘ knihovny a ₧e program ke svΘmu b∞hu pot°ebuje prost°edφ Java od verze 1.4.2.</p>
<br /><span class='comment'>Nativnφ SVG-XML editor Sketsa napsan² v Jav∞ (<a href='podklady/hejral/1138/sketsa1.png'>plnß velikost, cca 75 kB</a>)</span>
</div>
<p>Tento program je orientovan² spφÜe na programßtory a kodΘry. Pokud bych m∞l pou₧φt lidovΘ p°irovnßnφ, spφÜe ne₧ s u₧ivatelsky p°φjemn²m a kreativnφm Inkscapem je si blφzk² s editorem XStudio. Mno₧stvφ funkcφ je menÜφ, ale Sketsa je p°esto docela dob°e funkΦnφ. Nejvφce mi vadφ absence schopnosti vytvß°et slo₧enΘ cesty.</p>
<p>V∞tÜinu atribut∙ vektorov²ch objekt∙ nastavφte na praktickΘ palet∞ "Property" s n∞kolika zßlo₧kami - vÜe je na jednom mφst∞.</p>
<div class='image'>
<img src='podklady/hejral/1138/sketsa2.png' alt='Paletka pro definici p°echod∙ barev' title='Paletka pro definici p°echod∙ barev' />
<br /><span class='comment'>Programßtorskß orientace ΦiÜφ i z nastavovßnφ p°echod∙ barev</span>
</div>
<p>Plusem programu je naopak mo₧nost pracovat s SVG prvky <code>filter</code>. Sice pomocφ grafickΘ paletky, ale bohu₧el jen na velmi primitivnφ ·rovni, tak₧e se nevyhnete nutnosti znßt alespo≥ zßkladnφ teorii (tΘ teorie byste se m∞li doΦkat i <a href='http://interval.cz/serial.asp?serial=76' title='Interval.cz: Kurz SVG - tvorba vektorovΘ grafiky v XML'>v naÜem kurzu</a>). Vytvo°enΘ efekty a p°echody barev pro vφcenßsobnΘ pou₧itφ se spravujφ na paletce "Resource".</p>
<p>K dispozici je samoz°ejm∞ editor zdrojovΘho k≤du se zv²razn∞nφm syntaxe a XML editor.</p>
<br /><span class='comment'>Vytvß°enφ bitmapov²ch efekt∙ podle normy SVG</span>
</div>
<h3>Batik 1.5 - pokroΦil² prohlφ₧eΦ a knihovna pro prßci s formßtem SVG</h3>
<p>ZaΦnu tφm nejd∙le₧it∞jÜφm parametrem, kter²m je stupe≥ implementace kompletnφ SVG normy. V prvnφ °ad∞ je t°eba uvΘst, ₧e <a href='http://xml.apache.org/batik/'>projekt Batik</a> je soust°ed∞n pouze na statickΘ zobrazenφ a sami jeho tv∙rci tvrdφ, ₧e nemajφ v∞tÜφ ambice. Tato informace mne rozhodn∞ moc net∞Üφ, nicmΘn∞ ve statickΘm zobrazenφ grafiky je na tom Batik dost dob°e a krom <a href='http://www.adobe.com/svg/viewer/install/'>Adobe SVG Vieweru</a> (100% implementace normy) p°edΦφ vÜechny konkurenty - implementuje nap°φklad bitmapovΘ efekty (element <code>filter</code>) nebo prßci s SVG fonty v tΘm∞° ·plnΘm rozsahu.</p>
<br /><span class='comment'>Demonstrace knihoven Batik v praxi (<a href='podklady/hejral/1138/batik1.png'>plnß velikost, cca 120 kB</a>)</span>
</div>
<p>Batik 1.5 ale p°esto nenφ tak docela statick²m prohlφ₧eΦem SVG - implementuje toti₧ velmi dob°e skriptovßnφ s vyu₧itφm standardnφho SVG-DOM, vΦetn∞ obsluhy udßlostφ. (VypuÜt∞ny jsou pouze SMIL animace.)</p>
<div class='image'>
<img src='podklady/hejral/1138/batik3.png' alt='Hra "Miny" v SVG-DOM' title='Hra "Miny" v SVG-DOM' />
<br /><span class='comment'>Hra "Miny" demonstruje funkΦnost JavaScriptu a SVG-DOM</span>
<p>Samotn² projekt Batik obsahuje n∞kolik velmi zajφmav²ch program∙. Tφm nejviditeln∞jÜφm je samoz°ejm∞ p∞kn² prohlφ₧eΦ SVG - <strong>Squiggle</strong>. Jak m∙₧ete vid∞t na otisku obrazovky v²Üe, mezi nadstandardnφ vlastnosti prohlφ₧eΦe pat°φ nap°φklad zobrazenφ objektovΘho stromu, nebo t°eba navigaΦnφ paletka.</p>
<p>Krom prohlφ₧eΦe obsahuje projekt Batik i n∞kolik utilitek - t°eba <em>konverznφ program pro generovßnφ SVG font∙</em> nikde jinde nenajdete!</p>
<h3>TinyLine SVG Player 1.8 - prohlφ₧enφ SVG bez instalace prohlφ₧eΦe</h3>
<p>Nßsledujφcφ text bude spφÜe ne₧ recenzφ nßvodem, kterak zp°φstupnit vektorovou grafiku Φtenß°∙m webu, ani₧ byste je nutili k instalaci SVG prohlφ₧eΦe nebo zßsuvnΘho modulu. (P°edpoklßdßm samoz°ejm∞ podporu Javy v poΦφtaΦi s XHTML browserem.) Jednß se o vtipnΘ °eÜenφ vyu₧φvajφcφ Java applet <strong>TinyLine</strong>, kter² dokß₧e vykreslit grafiku ve formßtu SVG Tiny.</p>
<h4>Jak na lokßlnφm disku</h4>
<ol>
<li>Stßhn∞te si <em>tinylineforweb.zip</em> z <a href='http://www.tinyline.com/svgt/download/'>TinyLine SVG</a>.</li>
<li>Rozbalte archiv <em>tinylineforweb.zip</em>, zφskßte slo₧ku s nßvodem, licencφ, appletem a testovacφmi soubory.</li>
<li>Podobn∞ jako v ASV nebo Flash Playeru se pomocφ pravΘho tlaΦφtka dostanete do kontextovΘ nabφdky umo₧≥ujφcφ ovlßdßnφ SVG prohlφ₧eΦe.</li>
</ol>
<h4>Jak na serveru</h4>
<ol>
<li>Pokud chcete applet <strong>TinyLine</strong> vlo₧it do sv²ch webov²ch strßnek, musφte v prvnφ °ad∞ obsah v²Üe uvedenΘho archivu umφstit do slo₧ky na svΘm serveru tak, abyste se na n∞j mohli odkazovat (pozor na nastavenφ p°φstupov²ch prßv).</li>
<li>SVG grafiku vlo₧φte do XHTML k≤du nßsledujφcφm zßpisem:
<div class='sample'>
<!-- atributy elementu "applet":
<br /> code - trida "main" pro spusteni javovskeho kodu
<br /> archive - archiv obsahujici applet
<br /> width, height - pixelovy rozmer appletu ve strance
<div class='page-right-box reading'><h3 title='NejΦten∞jÜφ Φlßnky za poslednφch 14 dn∙'>NejΦten∞jÜφ</h3><div class='page-right-box-in'><ul><li><a href='http://interval.cz/__redirect/redirect.asp?what=interval_offline&url=http://interval.cz/clanek.asp?article=3829'>Interval.cz a jeho Φtenß°i v roce 2005</a></li><li><a href='http://interval.cz/__redirect/redirect.asp?what=interval_offline&url=http://interval.cz/clanek.asp?article=3830'>Pou₧φvßme nßvrhovΘ vzory v .NET - Singleton</a></li><li><a href='http://interval.cz/__redirect/redirect.asp?what=interval_offline&url=http://interval.cz/clanek.asp?article=3827'>SUN Java Studio Creator</a></li><li><a href='http://interval.cz/__redirect/redirect.asp?what=interval_offline&url=http://interval.cz/clanek.asp?article=3824'>Perl-compatible regulßrnφ v²razy v PHP - modifikßtory a lφnΘ kvantifikßtory</a></li><li><a href='http://interval.cz/__redirect/redirect.asp?what=interval_offline&url=http://interval.cz/clanek.asp?article=3831'>GNU Gettext - sprßva p°eklad∙</a></li></ul></div></div><div class='page-right-box cauldron'><h3 title='Nejdiskutovan∞jÜφ Φlßnky za poslednφch 21 dn∙'>Diskuznφ kotel</h3><div class='page-right-box-in'><ul><li><a href='http://interval.cz/__redirect/redirect.asp?what=interval_offline&url=http://interval.cz/clanek.asp?article=3818' title='(36 komentß°∙)'>PHP a MS SQL - vklßdßnφ a naΦφtßnφ soubor∙</a></li><li><a href='http://interval.cz/__redirect/redirect.asp?what=interval_offline&url=http://interval.cz/clanek.asp?article=3811' title='(26 komentß°∙)'>GNU Gettext - prvnφ kroky</a></li><li><a href='http://interval.cz/__redirect/redirect.asp?what=interval_offline&url=http://interval.cz/clanek.asp?article=3829' title='(20 komentß°∙)'>Interval.cz a jeho Φtenß°i v roce 2005</a></li><li><a href='http://interval.cz/__redirect/redirect.asp?what=interval_offline&url=http://interval.cz/clanek.asp?article=3815' title='(11 komentß°∙)'>H°φchy pro ÜφlenΘho korektora - jak se vyhnout zbyteΦn²m chybßm</a></li><li><a href='http://interval.cz/__redirect/redirect.asp?what=interval_offline&url=http://interval.cz/clanek.asp?article=3825' title='(11 komentß°∙)'>Ovlßdacφ prvok CAPTCHA v ASP.NET</a></li></ul></div></div>