Verkkosivujen grafiikkatyökalut
Salonen, Jaakko (2016-03-02)
Verkkosivujen grafiikkatyökalut
Salonen, Jaakko
(02.03.2016)
Tätä artikkelia/julkaisua ei ole tallennettu UTUPubiin. Julkaisun tiedoissa voi kuitenkin olla linkki toisaalle tallennettuun artikkeliin / julkaisuun.
Turun yliopisto
Kuvaus
Siirretty Doriasta
Tiivistelmä
Tutkielman tarkoituksena on vertailla verkkosivujen grafiikkatyökaluja. Tutkielmassa käsitellään kahta 2D-grafiikkaan liittyvää web-tekniikkaa: SVG:tä ja HTML5:n canvas-elementtiä. Ensin esitellään molemmat teknologiat, sitten käydään läpi molempien käyttöä esimerkkien ja kuvien avulla. Työssä esitetään myös eri tapoja toteuttaa animaatioita. Lopuksi teknologioita ja niiden käyttömahdollisuuksia vertaillaan.
Tutkielmassa pyritään vastaamaan seuraaviin kysymyksiin: Mitä ovat SVG ja HTML5:n canvas-elementti? Miten niitä käytetään? Miten ne eroavat toisistaan? Mihin käyttötarkoituksiin ne sopivat?
SVG on skaalautuvan vektorigrafiikan formaatti kaksiulotteisen grafiikan esittämiseen. SVG perustuu vektoreihin ja se kuvataan XML-tyylisellä kielellä. SVG soveltuu tilanteisiin, joissa kuviota halutaan suurentaa ja pienentää laadun kärsimättä.
HTML5:n uutuus canvas-elementti luo verkkosivulle piirtoalustan, johon voidaan piirtää JavaScriptillä Canvas API:n kautta. Canvas-alustalle piirretyt kuvat perustuvat bittikarttaan, joten teknologia soveltuu parhaiten pikseleiden tasolla tehtyihin operaatioihin ja esimerkiksi web-ohjelmien toteuttamiseen.
Tutkielmassa pyritään vastaamaan seuraaviin kysymyksiin: Mitä ovat SVG ja HTML5:n canvas-elementti? Miten niitä käytetään? Miten ne eroavat toisistaan? Mihin käyttötarkoituksiin ne sopivat?
SVG on skaalautuvan vektorigrafiikan formaatti kaksiulotteisen grafiikan esittämiseen. SVG perustuu vektoreihin ja se kuvataan XML-tyylisellä kielellä. SVG soveltuu tilanteisiin, joissa kuviota halutaan suurentaa ja pienentää laadun kärsimättä.
HTML5:n uutuus canvas-elementti luo verkkosivulle piirtoalustan, johon voidaan piirtää JavaScriptillä Canvas API:n kautta. Canvas-alustalle piirretyt kuvat perustuvat bittikarttaan, joten teknologia soveltuu parhaiten pikseleiden tasolla tehtyihin operaatioihin ja esimerkiksi web-ohjelmien toteuttamiseen.