登录

canvas 获取、复制画布上指定矩形区域的像素数据getImageData(),绘制像素数据putImageData()

我来纠错
//getImageData() 拷贝矩形区域的像素
返回 ImageData 对象,该对象拷贝了画布指定矩形的像素数据。
var imgData=context.getImageData(x,y,width,height);
参数	描述
x	开始复制的左上角位置的 x 坐标。
y	开始复制的左上角位置的 y 坐标。
width	将要复制的矩形区域的宽度。
height	将要复制的矩形区域的高度。

//putImageData() 将图像数据添加到画布上
方法将图像数据(从指定的 ImageData 对象)放回画布上。
context.putImageData(imgData,x,y,dirtyX,dirtyY,dirtyWidth,dirtyHeight);
参数	描述
x	ImageData 对象左上角的 x 坐标,以像素计。
y	ImageData 对象左上角的 y 坐标,以像素计。
dirtyX	可选。水平值(x),以像素计,在画布上放置图像的位置。
dirtyY	可选。水平值(y),以像素计,在画布上放置图像的位置。
dirtyWidth	可选。在画布上绘制图像所使用的宽度。
dirtyHeight	可选。在画布上绘制图像所使用的高度。

//实例
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
var imgData=ctx.getImageData(20,20,50,50);
ctx.putImageData(imgData,10,10);
发送
热门关键词:
命令
知识类型:
标题描述:
详细解答:

提交审核您编辑的知识会经过 前端大牛 人工审核。