Introduction of HTML5 Canvas element
In this article I have described about the canvas element in HTML5.
Introduction of canvas
- The main aim of canvas and SVG is to create graphics (image/video) inside the browser using coordinate points.
- It is used to create native interactivity and animation for web pages.
- First time, the canvas element was introduced by Apple in 2004.
- The canvas element has some attributes like height and weight and methods and methods to draw character, boxes, path and other adding image.
- In canvas, when any graphics is drawn and if its position has changed, the entire scene need to redraw.
Basic way to use canvas in HTML5
<canvas id="myCanvas" width="200" height="100"></canvas>
var rectangle = document.getElementById('rectangle');
var context = rectangle.getContext('2d');
context.fillStyle = 'red';
context.fillRect(30, 30, 50, 50);
this code will print rectangle of red color.
Following are some browsers which support the <canvas> element
- Internet explorer 9
They all have 2D canvas context capability.
You may also want to read these related articles :
Ask Your Question
Got a programming related question? You may want to post your question here
Programming Answers here