2

I'm trying to send a 2D array of RGB values to PHP from the array of values from the getImageData().data method:

for (var i=0;i<imgData.data.length;i+=4){

    // If you want to know the values of the pixel
    var r = imgData.data[i + 0];
    var g = imgData.data[i + 1];
    var b = imgData.data[i + 2];
    var a = imgData.data[i + 3];

    //[...] do what you want with these values
}

From this, how would I create a 2D array of RGB values of an entire canvas?

4

2 回答 2

4 
var rgb = [];
for (var i=0;i<imgData.data.length;i+=4){

    // If you want to know the values of the pixel
    var r = imgData.data[i + 0];
    var g = imgData.data[i + 1];
    var b = imgData.data[i + 2];
    var a = imgData.data[i + 3];

    var x = Math.floor((i/4) % imageData.width);  
    var y = Math.floor((i/4) / imageData.width);
    rgb[x] ? (rgb[x][y] = [r,b,g,a]) : (rgb[x] = [[r,b,g,a]]);
}
于 2012-09-06T02:13:19.393 回答
0

这可能不是您想要的，但如果您关心的是传输图像数据（不一定在客户端构建数组），则toDataURL()可能是传输图像数据的更简单方法......

HTML5canvas.toDataURL('image/png')方法将为您的图像数据生成一个数据 URI——即一个非常长的、文本编码的 PNG 版本。无需手动抓取图像数据。同样，如果需要，您可以使用 JPEG 编码。

如果您将此字符串发送到服务器，PHP 可以通过将其作为第一个参数传递给file_get_contents()（即）直接将其解码回二进制形式。然后，您可以将其保存到磁盘或对二进制 PNG 数据执行任何您想要的操作，就像使用刚刚从磁盘加载的文件一样。$binary = file_get_contents($dataURL)

于 2012-09-06T13:39:07.653 回答