Bakalářská práce se zaměřuje na možnosti využití animovaných SVG ve webovém rozhraní. Cílem práce bylo blíže seznámit čtenáře s možnostmi implementace animovaných SVG do webových stránek a aplikací.
Teoretická část zahrnuje popis formátu SVG, jeho vlastnosti a výhody oproti jiným formátům. Stručně je také představen jazyk JavaScript, který v kombinaci s SVG tvoří primární obsah praktické části. Na závěr jsou představeny JavaScriptové knihovny a programy určené pro animování a manipulaci s SVG.
Praktická část pak obsahuje implementaci zmíněných knihoven z teoretické části. Autor práce zde popisuje postupy, celkově nabyté dojmy a zkušenosti z jednotlivých knihoven a programů.
Annotation in English
The thesis focuses on the possibilities of using animated SVGs in web interfaces. The aim of the thesis was to familiarize the reader with the possibilities of implementing animated SVGs in web pages and applications.
The theoretical part includes a description of the SVG format, its features and advantages over other formats. The JavaScript language is also briefly introduced, which in combination with SVG forms the primary content of the practical part. Finally, JavaScript libraries and programs for animating and manipulating SVG are introduced.
The practical part contains the implementation of the libraries mentioned in the theoretical part. The author of the thesis describes here the procedures, overall impressions and experi-ences gained from each library and program.
Keywords
SVG, JavaScript, animace, webový design
Keywords in English
SVG, JavaScript, animation, web design
Length of the covering note
56
Language
CZ
Annotation
Bakalářská práce se zaměřuje na možnosti využití animovaných SVG ve webovém rozhraní. Cílem práce bylo blíže seznámit čtenáře s možnostmi implementace animovaných SVG do webových stránek a aplikací.
Teoretická část zahrnuje popis formátu SVG, jeho vlastnosti a výhody oproti jiným formátům. Stručně je také představen jazyk JavaScript, který v kombinaci s SVG tvoří primární obsah praktické části. Na závěr jsou představeny JavaScriptové knihovny a programy určené pro animování a manipulaci s SVG.
Praktická část pak obsahuje implementaci zmíněných knihoven z teoretické části. Autor práce zde popisuje postupy, celkově nabyté dojmy a zkušenosti z jednotlivých knihoven a programů.
Annotation in English
The thesis focuses on the possibilities of using animated SVGs in web interfaces. The aim of the thesis was to familiarize the reader with the possibilities of implementing animated SVGs in web pages and applications.
The theoretical part includes a description of the SVG format, its features and advantages over other formats. The JavaScript language is also briefly introduced, which in combination with SVG forms the primary content of the practical part. Finally, JavaScript libraries and programs for animating and manipulating SVG are introduced.
The practical part contains the implementation of the libraries mentioned in the theoretical part. The author of the thesis describes here the procedures, overall impressions and experi-ences gained from each library and program.
Keywords
SVG, JavaScript, animace, webový design
Keywords in English
SVG, JavaScript, animation, web design
Research Plan
Představte grafický formát SVG v kontextu použití ve webových dokumentech, základní principy, možnosti syntaxe, jeho vlastnosti a výhody.
Stručně představte jazyk JavaScript a základní možnosti interakce s SVG elementy.
Vyhledejte a představte javaskriptové knihovny pro pokročilejší práci s SVG grafikou na webu.
Pomocí vybraných knihoven vytvořte ukázkové příklady jejich využití a uveďte porovnání jejich možností a způsobu použití.
Vyberte a otestujte programy pro tvorbu SVG animací, vypracujte ukázkové příklady a uveďte porovnání programů.
Research Plan
Představte grafický formát SVG v kontextu použití ve webových dokumentech, základní principy, možnosti syntaxe, jeho vlastnosti a výhody.
Stručně představte jazyk JavaScript a základní možnosti interakce s SVG elementy.
Vyhledejte a představte javaskriptové knihovny pro pokročilejší práci s SVG grafikou na webu.
Pomocí vybraných knihoven vytvořte ukázkové příklady jejich využití a uveďte porovnání jejich možností a způsobu použití.
Vyberte a otestujte programy pro tvorbu SVG animací, vypracujte ukázkové příklady a uveďte porovnání programů.
Recommended resources
GLITSCHKA, Von. Vektory: základní výcvik. Brno: Computer Press, 2013. ISBN 9788025141298.
PEHLIVANIAN, Ara a NGUYEN, Don. JavaScript okamžitě. Brno: Computer Press, 2014. ISBN 9788025141632.
ODELL, Den. JavaScript: průvodce programováním ajaxových aplikací. Brno: Computer Press, 2010. ISBN 9788025127339.
LARSEN, Rob. Mastering SVG. Velká Británie: Packt Publishing, 2018. ISBN 9781788621984.
