undergraduate thesis
SVG graphics on Web

Franjo Galeković (2017)
Polytechnic of Međimurje in Čakovec
Metadata
TitleSVG grafike na web-u
AuthorFranjo Galeković
Mentor(s)Sanja Brekalo (thesis advisor)
Abstract
U ovom radu opisan je SVG (engl. Scalable Vector Graphics) format i način rada web aplikacija koje ga koriste, animacija SVG-a, dostupne biblioteke, 3D SVG grafike, prednosti i nedostaci. Prikazani su primjeri izrade jednostavnih oblika, dodavanja teksta, stila i transformacije, primjenjivanje gradijenata, isječaka, maskiranja i filtera, te kreiranje jednostavnog uzorka. Prikazana je i animacija, interaktivnost i skriptiranje sa SVG elementima. U nekoliko primjera odvijaju se dvije vrste animacija: koristeći SMIL (engl. Synchronized Multimedia Integration Language) i koristeći JavaScript. JavaScript je bolje podržan i više se koristi na web-u. SVG je XML (engl. eXtensible Markup Language) što u prijevodu znači: jezik za opis vektorske grafike, animacije i aplikacija. Važno je sučelje DOM (engl. Document Object Model) kojeg izrađuje pretraživač kad pročita SVG datoteku, jer se preko njega iscrtavaju i manipuliraju SVG datoteke. Nakon navedenih primjera, prikazana je funkcionalna web aplikacija: interaktivna SVG karta Hrvatske. Karta se sastoji od županija Hrvatske koje se mogu označiti i kao takve pohraniti u zadanom formatu. Izrađena aplikacija SVG karta Hrvatske može služiti kao smjernica posjećenih županija ili u neke edukativne svrhe. Aplikaciju je lako koristiti te je ista podržana u svim novijim verzijama pretraživača. Također, predstavit će se dostupne biblioteke SVG-a, a neke od njih su: Raphaël - JavaScript Library, SVGWeb, dojox.gfx, SVGKit, amMap, PlotKit, JSDraving, VectorGraphics i PERGOLA. Adobe Illustrator, Inkscape i SVG-edit su jedni od najpoznatijih SVG editora koji služe za izradu i uređivanje SVG grafike. Najvažnija karakteristika SVG dokumenata je njihova skalabilnost - moguće ih je proizvoljno smanjivati ili povećavati bez gubitka kvalitete ili izobličenja. Prema standardima koji važe u XML-u, SVG dokument se sastoji od hijerarhijski posloženih zapisa koji sadrže informacije o geometrijskim elementima ili tekstu od kojih se sastoji grafika. Glavne tehnologije za izradu web animacije su HTML5 Canvas, SVG i Flash. Danas se sve više koriste HTML5 Canvas i SVG tehnologije.
Parallel title (English)SVG graphics on Web
Committee MembersBruno Trstenjak (committee chairperson)
Jurica Trstenjak (committee member)
Sanja Brekalo (committee member)
GranterPolytechnic of Međimurje in Čakovec
PlaceČakovec
StateCroatia
Scientific field, discipline, subdisciplineTECHNICAL SCIENCES
Computing
Program Engineering
Study programme typeprofessional
Study levelundergraduate
Study programmeProfessional Study programe Computer Engineering; specializations in: Programming and software engineering, Computer systems and network engineering
Study specializationComputer systems and network engineering
Academic title abbreviationbacc. ing. comp.
Genreundergraduate thesis
Language Croatian
Defense date2017-02-24
Parallel keywords (Croatian)SVG XML animacija JavaScript DOM
Resource typetext
Access conditionOpen access
Terms of usehttp://rightsstatements.org/vocab/InC/1.0/
URN:NBNhttps://urn.nsk.hr/urn:nbn:hr:110:936742
CommitterPetra Horvat