Get image data and put image data to Canvas with getImageData and putImageData - Javascript DOM HTML Element

Javascript examples for DOM HTML Element:Image

  1. HOME
  2. Javascript
  3. DOM HTML Element
  4. Image

Description

Get image data and put image data to Canvas with getImageData and putImageData

Demo Code

ResultView the demo in separate window 

<html>
   <head> 
      <meta name="viewport" content="width=device-width, initial-scale=1"> 
      <script type="text/javascript">
    window.onload=function(){//w ww.  j a  v  a 2  s  .  com
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.shadowColor = 'black';
ctx.shadowBlur = 15;
var imgdata = ctx.getImageData(20, 30, 150, 75);
ctx.strokeRect(20, 30, 150, 75);
ctx.putImageData(imgdata, 20, 30);
    }

      </script> 
   </head> 
   <body> 
      <canvas id="myCanvas"></canvas>  
   </body>
</html>

Related Tutorials