SVG based engine for rendering isometric graphic

Bc. Vít Svoboda

Master's thesis

Abstract:

Tato práce zkoumá možnosti využití HTML5 elementu svg pro vykreslení herní grafiky. Popisuje implementační experiment, jejímž výstupem je grafické jádro umožňující vykreslovat do svg elementu izometrické hry, u nichž je herní plocha rozdělena na pravidelná pole. Zároveň také shrnuje rozdíly této metody oproti použití HTML5 elementu canvas. Za použití navrhované implementace následně zhodnocuje reálnost použití svg elementu ve hrách. Vzhledem ke zjištěné nekonzistenci výkonu u různých internetových prohlížečů se zdá být element canvas, který je k tomuto účelu obvykle používán, lepší volbou.

Abstract:

This thesis examines the possibilities of using the HTML5 svg element for drawing game graphics. It describes an implementation attempt that would result in a graphics engine able to draw an isometric tile-based game in the svg element. Along with that it also summarizes differences to the HTML5 canvas element method of use. Finally, using the proposed implementation, assesses the usability of the svg element in games. Considering the performance differences across various web browsers, the canvas element, usually used for that purpose, seems to be a better option.

Keywords

2D graphics, game engine, HTML5, isometric projection, JavaScript, sprites, SVG

Language used: English

Date on which the thesis was submitted / produced: 25. 5. 2015

Thesis defence

• Date of defence: 26. 6. 2015
• Supervisor: Mgr. Marek Grác, Ph.D.
• Reader: Mgr. Jan Bušta

Masaryk University

Faculty of Informatics

Master programme / field:
Applied Informatics / Applied Informatics