HTML 参考手册
HTML canvas putImageData() 方法
下面的代码通过 getImageData() 复制画布上指定矩形的像素数据,然后通过 putImageData() 将图像数据放回画布
源代码:
点击运行 »
<canvas id="myCanvas" width="300" height="150" style="border:1px solid #d3d3d3;"> 您的浏览器不支持 HTML5 canvas 标签。 </canvas> <script> var c = document.getElementById("myCanvas"); var ctx = c.getContext("2d"); ctx.fillStyle = "red"; ctx.fillRect(10, 10, 50, 50); function copy() { var imgData = ctx.getImageData(10, 10, 50, 50); ctx.putImageData(imgData, 10, 70); } </script> <button onclick="copy()">复制</button>
运行结果:
点击运行 »