gpt4 book ai didi

javascript - 如何剪辑从 getImageData() 函数获取的图像?

转载 作者:行者123 更新时间:2023-11-30 18:34:35 25 4
gpt4 key购买 nike

我正在尝试获取源 Canvas 的内容,对其进行剪辑,然后将其绘制到另一个 Canvas 上。即使我的代码在使用 src PNG/new Image() 组合时工作得很好,但当源内容来自另一个 Canvas 时它不会。

代码是:

var imgData = src_ctx.getImageData(x, y, w, h);
dest_ctx.putImageData(imgData, x, y+h);

ctx.beginPath(); // Filled triangle
ctx.moveTo(x1,y1);
ctx.lineTo(x2,y2);
ctx.lineTo(x2,0);
ctx.lineTo(x1,0);
ctx.clip();

最佳答案

定义裁剪区域后,使用 drawImage 绘制源 Canvas ,而不是设置图像数据。

dest_ctx.beginPath(); // Filled triangle
dest_ctx.moveTo(x1,y1);
dest_ctx.lineTo(x2,y2);
dest_ctx.lineTo(x2,0);
dest_ctx.lineTo(x1,0);
dest_ctx.clip();

// You can control wich region to draw using all the arguments
// drawImage(image, sx, sy, sWidth, sHeight, dx, dy, dWidth, dHeight)
dest_ctx.drawImage (srcCanvas, x, y);

关于javascript - 如何剪辑从 getImageData() 函数获取的图像?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8620746/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com