SVG
SVG (engl. Scalable Vector Graphics) je XML jezik za prikazivanje dvodimenzionalne vektorske grafike, statične ili animirane. To je otvoreni standard čiji je tvorac Konzorcijum za veb, zaslužan i za poznate standarde kao HTML i XHTML.
 |
|
| Ekstenzija datoteke: | .svg, .svgz |
|---|---|
| Razvio: | W3C |
| Prvo pojavljivanje: | 2001. |
| Tip formata: | Vektor |
Pregled uredi
Veb-standardi
SVG se razvija od 1999. od grupe kompanija uključenih u udruženje W3C, poslije pregleda standarda predloženih od kompanija Adobe Systems (PGML) i Microsoft (VML) razvijenog od RTF – predatih u W3C 1998. Za formulaciju SVG su korišćena iskustva oba formata.
SVG dozvoljava 3 tipa grafičkih objekata:
Grafički objekti mogu biti postavljeni u grupe i transformirani u prethodno renderovane objekte. Nisu direktno podržani Z-indikatori (z-indices) [1], koji razdvajaju poredak crtanja od poretka dokumenata za preklapajuće objekte. Tekst može da bude u bilo kojem XML imenskom prostoru (namespace) što olakšava pretragu.
Od 2001. specifikacija je na verziji 1.1, a na verziji 1.2 se radi.
SVG Mobile preporuka je uključila dva jednostavnija profila SVG 1.1, SVG Basic and SVG Tiny, namenjene za uređaje sa smanjenim mogućnostima.
SVG Tiny je kasnije postao posebna preporuka sa trenutnom verzijom 1.2 i baza za predloženi SVG 1.2.
Postoji i SVG Print, specifikacija na kojoj se još radi i koja sadrži upute za štampanje za SVG 1.2 i SVG Tiny 1.2 dokumente.
Platno (kanvas) element u HTML5 daje pomalo drugačiji pristup prikaza dinamičke grafike u HTML. Nažalost, on ne dozvoljava statičko renderovanje i nacrtani elementi nisu identifikovani kao kod DOM.
Štampanje uredi
Iako je primarno stvoren kao grafički jezik, specifikacija ima i osnovne sposobnosti kao jezik za opis stranica (PDL) kao i PDF format. Ima mogućnosti korišćenja složene grafike, a kompatibilan je i sa CSS.
Animacija i skriptovanje uredi
SVG crteži mogu biti dinamički i interaktivni. Modifikacije u vremenu se mogu opisati u SMIL, ili programirane u nekom jeziku kao što je JavaScript. W3C eksplicitno preporučuje SMIL kao standard za animaciju u SVG.[2] Bilo kojem grafičkom SVG objektu se može pridružiti programski kod, koji se izvršava recimo pri kliku ili prelazom pokazivača računarskog miša preko objekta.
Kompresija uredi
Pošto tekstualne datoteke obično sadrže dosta delova teksta koji se ponavljaju, posebno su podesne za kompresiju programima kao što su zip, gzip i arj.
Primjeri uredi
SVG je XML jezik, te je SVG datoteka obična tekstualna datoteka, koja se može uređivati u bilo kojem uređivaču teksta.
Kvadrat ili pravougaonik uredi
<?xml version="1.0"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns="http://www.w3.org/2000/svg"
width="467" height="462">
<rect x="80" y="60" width="250" height="250" rx="20"
style="fill:#ff0000; stroke:#000000;stroke-width:2px;" />
<rect x="140" y="120" width="250" height="250" rx="40"
style="fill:#0000ff; stroke:#000000; stroke-width:2px;
fill-opacity:0.7;" />
</svg>
Prvo su date dimenzije čitave slike. Zatim su date koordinate gornjeg levog ugla kvadrata. Zatim sledi širina, visina, radijus zaobljenosti ugla kvadrata, boja kvadrata, boja ivica i širina ivica kvadrata.
Linija uredi
Kod za prikazivanje linije:
<svg width="150" height="150" xmlns="http://www.w3.org/2000/svg" >
<line x1="10" y1="10" x2="50" y2="100" stroke="red" stroke-width="2"/>
</svg>
Poslije dimenzija slike, slede koordinate početka linije, zatim koordinate kraja linije, boja, širina linije.
Krug uredi
Kod za prikazivanje ispunjenog kruga:
<svg width="150" height="150" xmlns="http://www.w3.org/2000/svg" >
<circle cx="50" cy="50" r="25" fill="blue"/>
</svg>
Poslije dimenzija slike, slede koordinate centra kruga, radijus kruga i boja kojom je ispunjen.
Elipsa uredi
Kod za prikazivanje neispunjene elipse:
<svg width="150" height="150" xmlns="http://www.w3.org/2000/svg" >
<ellipse cx="50" cy="50" rx="30" ry="12" fill="none" stroke="red" stroke-width="3"/>
</svg>
Tekst uredi
Kod za prikazivanje teksta, koji može biti unikodni:
<svg width="150" height="150" xmlns="http://www.w3.org/2000/svg" >
<text x="80%" y="80%" font-family="sans-serif">Поздрав корисницима Википедије!</text>
</svg>
Kompleksne figure uredi
Kod za prikazivanje figure koja se sastoji od zakrivljenih sekcija:
<svg width="500" height="500" xmlns="http://www.w3.org/2000/svg" >
<path id="Inv_V_MCcZ" style="fill:#00DD00;stroke:none;" d=" M 25 360 C 60 360 80 275 75 260 c -5 15 15 100 50 100 Z "/>
</svg>
Izvori uredi
- ^ „SVG(W3C) § 4.2-Drawing Order”. World Wide Web Consortium. 15. 11. 2002. Pristupljeno 19. 10. 2009.
- ^ Paul, Festa (9. 1. 2003). „W3C releases scripting standard, caveat”. CNet. Pristupljeno 24. 2. 2010.
