HTML can interact with a bitmapped surface thanks to the HTML canvas element. It's used to create graphics for a website.
The < canvas> element can be used to create graphics on a webpage with the help of javascript. This element is a container for drawing graphics. Javascript is required to actually draw the elements. The element has many methods to draw lines, boxes, circles, images, etc.
A canvas can be defined as a rectangular region on a webpage. It has no border and no content by default.
2D forms and bitmap images can be rendered dynamically and scriptable using the < canvas> element. It's a procedural model with no built-in scene that changes a bitmap at a low level. In canvas, you may draw paths, boxes, circles, text, and images using various methods.
To draw a straight line on the canvas, we can use the methods: moveTo(x,y) : Defines the start of the line lineTo(x,y) : Defines the end of the line stroke() : Used to draw the line
arc(x,y,r,start,stop) : can be used to draw the circle
Font property: used to declare the font for the text which will be displayed fillText(text,x,y): used to draw filled text, the font is in bold.
strokeText(text,x,y) : used to draw text which is unfilled
fillRect(0,0,x,y) : used to draw a rectangle which starts at 0,0 and draws x * y rectangle.
|