Question

我有一个html画布，如下所示：

//output is a base64string of image data
var oldImage = new Image();
oldImage.onload = function () {
  var resizeRatio = oldImage.width / 500;
  var height = oldImage.height / 2;
};
oldImage.src = output;
var standardizedCanvas = document.createElement("canvas");
standardizedCanvas.setAttribute("width", "500px");
standardizedCanvas.setAttribute("height", height + "px");
standardizedCanvas.getContext("2d").drawImage(oldImage, 0, 0, frontCanvas.width, frontCanvas.height);

所以我可以将图像读入画布，然后获取图像数据。但这真的给了我什么呢？我需要画布中的byte[]，其中包含图片数据，所以我真的想将base64字符串转换为byte[]。我是在正确的轨道上，还是......？

Answer 1

调用getImageData会返回ImageData个对象。

文档：

https://developer.mozilla.org/en-US/docs/Web/API/ImageData

https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/getImageData

data对象的ImageData属性是一个长度为4 * width * height的字节数组。

像素按行从左上到右下排成一行，每个像素用4个字节表示，红色，绿色和alpha。

从<canvas>获取byte []

1 个答案: