画布getImageData但按比例缩小

Question

我在尺寸为280、280的画布上绘制一些东西。我想从该画布中获取图像数据，但尺寸为28、28。

我不能只是这样做：

Set<Category> categories = person.getCategories()

因为剩下的28、28都将被切断。所以我尝试了这样的事情：

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

还有这个

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

但都没有用。

Answer 1

您在第一个画布上绘制图像。

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

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

最后，您从第二个画布获取图像数据：

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