Skaalautuva vektorigrafiikka mobiiliselaimissa
Lind, Mihkel (2016)
Lind, Mihkel
Haaga-Helia ammattikorkeakoulu
2016
All rights reserved
Julkaisun pysyvä osoite on
https://urn.fi/URN:NBN:fi:amk-2016121219924
https://urn.fi/URN:NBN:fi:amk-2016121219924
Tiivistelmä
Tässä opinnäytetyössä tutkittiin miten skaalautuvaa vektorigrafiikkaa (SVG) implementoidaan verkkosivulle ja minkälainen selaintuki sillä on mobiililaitteissa. Tutkimuksen ulkopuolelle rajattiin javascripti -kieli sekä SVG:n animointi.
Teoriaosuudessa kuvattiin mitkä ovat SVG:n etuja bittigrafiikkaan nähden sekä mainittiin SVG:n eri versioiden erot. Lisäksi käsiteltiin SVG:n ominaisuudet ja rakenne sekä sen keskeiset elementit ja attribuutit. Teoriaosuudessa käytiin myös läpi kuinka SVG koordinaatisto toimii ja mitkä tekijät siihen vaikuttavat. SVG:n implementointi esiteltiin yleisimpien tapojen osalta ja lisäksi esitettiin tapoja toteuttaa responsiivinen SVG -kuva.
Empiriaosuudessa kuvattiin mitä, millä, miten ja missä selaintukea testattiin. Testaus käsitti kuusi erilaista SVG:n käyttötapaa, joita testattiin kolmella fyysisellä mobiililaitteella. Lopulliset tulokset saatiin havainnoimalla kuvakaappauksia ja vertaamalla niitä teoriaan.
SVG:n selaintuen todettiin olevan hyvällä tasolla perusominaisuuksien osalta myös mobiiliselaimissa. Perimmäinen johtopäätös oli, että SVG on laiteriippumaton kuvamuoto, sillä se tuottaa suorituskykyistä ja tarkkaa kahdensuuntaista grafiikkaa kaiken tyyppisille laitteille. Tutkimuksen tuloksena syntyi teoriaan ja empiriaan pohjautuva tiivis ohjeisto SVG:n käytöstä verkkosivulla.
Teoriaosuudessa kuvattiin mitkä ovat SVG:n etuja bittigrafiikkaan nähden sekä mainittiin SVG:n eri versioiden erot. Lisäksi käsiteltiin SVG:n ominaisuudet ja rakenne sekä sen keskeiset elementit ja attribuutit. Teoriaosuudessa käytiin myös läpi kuinka SVG koordinaatisto toimii ja mitkä tekijät siihen vaikuttavat. SVG:n implementointi esiteltiin yleisimpien tapojen osalta ja lisäksi esitettiin tapoja toteuttaa responsiivinen SVG -kuva.
Empiriaosuudessa kuvattiin mitä, millä, miten ja missä selaintukea testattiin. Testaus käsitti kuusi erilaista SVG:n käyttötapaa, joita testattiin kolmella fyysisellä mobiililaitteella. Lopulliset tulokset saatiin havainnoimalla kuvakaappauksia ja vertaamalla niitä teoriaan.
SVG:n selaintuen todettiin olevan hyvällä tasolla perusominaisuuksien osalta myös mobiiliselaimissa. Perimmäinen johtopäätös oli, että SVG on laiteriippumaton kuvamuoto, sillä se tuottaa suorituskykyistä ja tarkkaa kahdensuuntaista grafiikkaa kaiken tyyppisille laitteille. Tutkimuksen tuloksena syntyi teoriaan ja empiriaan pohjautuva tiivis ohjeisto SVG:n käytöstä verkkosivulla.