HTML5 has tags for graphics like:
1. Canvas
2. SVG
There are certain differences between the two:
1. SVG is resolution independent while canvas is resolution dependent.
2. SVG supports event handlers while canvas doesnot support event handlers
3. SVG is suited for larger redering area while canvas doesn't have that capability.
4. SVG is not suited for game application while canvas is suited for graphic intensive games.
Syntax of SVG:
HTML:
<svg width="100" height="100">
<circle cx="50" cy="50" r="40" stroke="blue" stroke-width="4" fill="red" />
</svg>
Syntax of canvas:
HTML:
<canvas id="demo" width="300" height="300" style="1px solid #333;"></canvas>
JS:
var element = document.getElementById("demo");
var graphic = element.getContext("2d");
element.font = "30px Arial";
element.strokeText("See the change.......",10,50);
element.fillstyle="#ddd";
element.fillRect(0,0,200,50);
Hope this will make you understand more about graphic tag.
0 Comment(s)