In HTML5 as there are many elements, like these elements canvas is also
a an element which is used to draw amazing graph with its powerful functionality and
decrease the difficulties and increases the easiness. To implement this element, javascript
is used with it. Convas is also used for compositions and animations.
Example of Canvas
<style>canvas{border:2px solid orange;}</style><canvasid="myCanvas"width="200"height="100">Not supported</canvas><script>var elem = document.getElementById("myCanvas"); var x = elem.getContext("2d"); x.moveTo(0,0); x.lineTo(200,100); x.stroke();</script>
Circle shape canvas
<style>canvas{border:2px solid orange;}</style><canvasid="myCanvas"width="200"height="100">Not supported</canvas><script>var c = document.getElementById("MyCanvas"); var ctx = c.getContext("2d"); ctx.beginPath(); ctx.arc(95,50,40,0,2*Math.PI); ctx.stroke();</script>
Some uses of canvas
For Rectangles
- Canvas is used to draw rectangles.
For Paths
- Canvas is used to make different shapes of path.
For Lines
- Canvas is used to make different style's of lines.
For Bezier
- Canvas is used to make different bezier curves
For Quadratic
- Canvas is used to make different quadratic curves
For Images
- Canvas is used to give different styles to image.
For Gradients
- Canvas is used to make gradients.
For Styles and Colors
- Canvas is used in styling and colors.
For Text and Fonts
- Canvas is used to give different styles to Text and fonts.
For Pattern and Shadow
- Canvas is used for making different styles of pattern and shadow.
For Rotation
- Canvas is used in rotating.
For Scaling
- Canvas is used for scaling.
For Transform
- Canvas is used in transform.
The Best
Comment here
If you have any query, if you want to know something about any of technical course related to computer science field, if you have any suggestion about relevant to uploaded content or if you anything wrong here (any mistake in content) than please contact us. Keep in mind, comment should be according to community guidelines.
