canvasrenderingcontext2d.putimagedata(imagedata imagedata, number dx, number dy, number dirtyx, number dirtyy, number dirtywidth, number dirtyheight)
基础库 或更高版本； 若版本较低，建议采取 兼容处理。
主体： 企业支付宝小程序 、 个人支付宝小程序
将像素数据绘制到画布中。
效果示例
代码示例运行效果
imagedata 对象。
number dx
绘制像素数据的 x 坐标。
number dy
绘制像素数据的 y 坐标。
number dirtyx
矩形提取区域的左上角的 x 坐标。可选。传入此值后，只会绘制提取区域内的像素信息。
number dirtyy
矩形提取区域的左上角的 y 坐标。可选。传入此值后，只会绘制提取区域内的像素信息。
number dirtywidth
矩形提取区域的宽度。可选。传入此值后，只会绘制提取区域内的像素信息。
number dirtyheight
矩形提取区域的高度。可选。传入此值后，只会绘制提取区域内的像素信息。
代码示例
.js
.axml
page({
oncanvasready() {
my.createselectorquery().select('#canvas').node().exec((res) => {
const canvas = res[0].node
const ctx = canvas.getcontext('2d')
let img = canvas.createimage()
img.src = "https://mdn.alipayobjects.com/huamei_esgcm9/afts/img/a*s8quqr2unzaaaaaaaaaaaaaadsajaq/original"
img.onload = function () {
ctx.drawimage(img, 10, 10, 250, 80)
// 获取 canvas 内指定区域内的像素信息
let data = ctx.getimagedata(10, 10, 250, 80)
// 把像素信息放到到 canvas 的指定位置
console.log(ctx.putimagedata(data, 10, 120, 0, 0, 50, 60))
}
})
},
})<canvas id="canvas" type="2d" onready="oncanvasready">canvas>