生成二维数组值

Question

我想送RGB值的二维数组从值从getImageData（）数据的方法数组PHP：

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 
} 

由此看来，如何将我创建了一个整个画布的RGB值的二维数组？

Answer 1

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]]); 
} 

Answer 2

这可能不是你想要的，但如果你关注的是传送图像数据（不一定是建立在客户端阵列），toDataURL()可能是一个传输图像数据更简单的方法..

HTML5 canvas.toDataURL('image/png')方法将产生一个data URI为您的图像数据 - 即一个非常长，文本编码的PNG版本。不需要手动获取图像数据。同样，如果可以的话，你可以使用JPEG编码。

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