Elements – Canvas Tag

Canvas Tag

You can use a canvas to draw and animate graphics and text. The drawings are done with JavaScript, so you will want to have an id in order to select the canvas.

<canvas id="canvas" width="200px" height="200px"> </canvas>

Once you’ve made your canvas, you need to find it and make a drawing object.

// Find canvas var canvas = document.getElementById("canvas"); // Make drawing object var drawOnCanvas = canvas.getContext("2d"); // Draw a rectangle on the canvas! drawOnCanvas.fillRect(50, 50, 150, 100);

Now you can use this drawing object to draw on your canvas. There are several methods and attributes you can use for your drawing, including rect(), fillStyle, and many more.

More Information:

Canvas Reference

This article needs improvement. You can help improve this article. You can also write similar articles and help the community.