Html5 canvas draw image Tag

The canvas draw image tag is used to draw a image graphics on the web page.

Example Code



<!DOCTYPE HTML>
<canvas id="draw_image" width="200" height="100">
  Your browser does not support the canvas element.
</canvas>
<script type="text/javascript">
  var c=document.getElementById("draw_image");
  var cxt=c.getContext("2d");
  var img=new Image()
  img.src="../images/flower-icon.jpg"
  cxt.drawImage(img,30,30);
</script>

Out Put :

Your browser does not support the canvas element.

In the above example code drawImage() function is used to draw image to broswer. The first parameter img is a image tag and second and thired parameter is used to left and top position for a image.





Content