Taggen CANVAS används för att skapa en rektangel i vilken man ritar upp vektorgrafik med hjälp av JavaScript. Man är inte begränsad till endast färger utan man kan fylla figurerna med gradienter och/eller bilder/mönster.

Här följer ett exempel - först gör man rutan som ska innehålla canvas. Koden för detta ser ut såhär: <canvas id="myCanvas" width="200" height="100" style="border:1px solid #000000;"> </canvas> Resultatet ser då ut såhär:

Nu är html-delen klar. Nu gäller det att fylla canvasen med innehåll och det gör man med hjälp av JavaScript.

Det finns verktyg på nätet för att göra om SVG till canvas. observera att detta är ett område som utvecklas snabbt och därigenom förändras sajterna också väldigt snabbt.


Tutorial av grundläggande former/färger/text
www.irunmywebsite.com/raphael/SVGTOHTML_LIVE90.php
www.professorcloud.com/mainsite/index.htm
www.omnisoftsystems.com/?returnUrl=/iTrax/Home/svg2Canvas

Jämförelse av olika konverteringstjänster

orginalfilen i SVG-format

omnisoftsystems

Javascript SVG parser and renderer on Canvas

https://code.google.com/p/canvg/