相关疑难解决方法(0)

我有一个base64编码的PNG.我需要使用javascript获取像素的颜色.我假设我必须将其转换回正常的PNG.谁能指出我正确的方向？

虽然以前似乎已经问过这个问题,但人们依靠画布进行转换.问题是来自base64 url​​,如下所示: data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAAFElEQVQIW2NkYGD4D8RYAeOQkgQAERQHAbuZaGoAAAAASUVORK5CYII=

var array = [ [0x00,0x00,0x00], ... 49 times ];对于7px×7px图像(在这种情况下是黑色)的像素阵列,像这样的颜色强度 ,我们必须使用这样的代码:

var mCanvas = document.createElement('canvas');
var base64DataUrl = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAAFElEQVQIW2NkYGD4D8RYAeOQkgQAERQHAbuZaGoAAAAASUVORK5CYII=";
mCanvas.width = 7;
mCanvas.height = 7;
var mContext = mCanvas.getContext('2d');
var myImage = new Image();
myImage.setAttribute("src", base64DataUrl);
myImage.onload = function() { 
    var mContext = mCanvas.getContext('2d');
    var mImgData = mContext.getImageData(0,0,mCanvas.width,mCanvas.height);
}

由于onload而变得异步并且非常痛苦(尽管它有效).

然后我们将使用这样的代码从画布中获取RGBA颜色

function convertCanvasToPixelsArray(mCanvas){
    var mContext = mCanvas.getContext('2d');
    console.log(mCanvas.width);
    var mImgData = mContext.getImageData(0,0,mCanvas.width,mCanvas.height);

    var srcIndex=0, dstIndex=0, curPixelNum=0;
    var pixelsArray = new Array(mCanvas.width*mCanvas.height);
    for (curPixelNum=0; curPixelNum<mCanvas.width*mCanvas.height;  curPixelNum++) …