JavaScript-Canvas getImageData但按比例缩小

我在尺寸为280、280的画布上绘制一些东西.我想从该画布中获取ImageData,但尺寸为28、28.

我不能只是这样做:

const imgData = this.ctx.getImageData(0, 0, 28, 28);

因为28之后的其余部分,将被截断28.所以我尝试了这样的事情:

this.ctx.width = 28;
this.ctx.height = 28;
const imgData = this.ctx.getImageData(0, 0, 28, 28);
console.log(imgData);

和这个

this.ctx.scale(0.1, 0.1);
const imgData = this.ctx.getImageData(0, 0, 28, 28);
console.log(imgData);

但是都没有用.

最佳答案
您在第一个画布上绘制图像.

接下来,将第一个画布用作图像在28/28的第二个画布上绘制.

var img = document.querySelector("#canvas1");
ctx2.drawImage(img,0,0,28,28);

最后,您从第二个画布获取图像数据:

ctx2.getImageData(0,0,28,28)

转载注明原文:JavaScript-Canvas getImageData但按比例缩小 - 代码日志