Code
Execute
<!DOCTYPE html> <html> <head> <title>wikitechy-HTML Canvas putImageData()</title> </head> <body> <h1>wikitechy-HTML Canvas putImageData() with example: </h1> <canvas id="wikitechyCanvas" width="450" height="200" style="border:1px solid #d3d3d3;"> </canvas> <script> var p = document.getElementById("wikitechyCanvas"); var context = p.getContext("2d"); context.fillStyle = "green"; context.fillRect(50, 50, 100, 80); function copy() { var imgData = context.getImageData(50, 50, 100, 80); context.putImageData(imgData, 200, 50); } </script> <button onclick="copy()">Copy</button> </body> </html>
Result