Fatal编程技术网
  • javascript/
  • Javascript HTML画布返回“；被一些人“拒绝”；来自getImageData的字节数

Javascript HTML画布返回“；被一些人“拒绝”；来自getImageData的字节数

javascript html5-canvas

Javascript HTML画布返回“；被一些人“拒绝”；来自getImageData的字节数,javascript,html5-canvas,Javascript,Html5 Canvas,我发现HTML画布的getImageData似乎返回了不正确的字节值 我使用以下Python代码生成了一个1x1 px映像： 从PIL导入图像 将numpy作为np导入 a=np.array（[[[12187146,62]]，dtype=np.uint8） Image.fromarray（a.save（'Image.png'）） 我将图像转换为base64以将其包含在此代码段中： let image=document.createElement（'img'）； image.addEventL

我发现HTML画布的
getImageData
似乎返回了不正确的字节值

我使用以下Python代码生成了一个1x1 px映像：

从PIL导入图像
将numpy作为np导入
a=np.array（[[[12187146,62]]，dtype=np.uint8）
Image.fromarray（a.save（'Image.png'））
我将图像转换为base64以将其包含在此代码段中：

let image=document.createElement（'img'）；
image.addEventListener（'load'，（）=>{
让canvas=document.createElement（'canvas'）；
设ctx=canvas.getContext（“2d”）；
canvas.width=image.width；
canvas.height=image.height；
ctx.drawImage（图像，0,0）；
让data=ctx.getImageData（0，0，canvas.width，canvas.height）；
document.body.innerHTML=数据；
});
image.src=“数据：image/png；base64，ivborw0kggoaaaansuhueugaaaaaabcayaaaaffcsjaaaaduleqvr4ngpg2t3jdgadymyisbaqaaabjru5erkjggg=”Firefox乘法前舍入错误
我可以确认FF（Firefox）确实返回像素值为
[12189148,62]

渲染到画布时，将根据默认为的值处理像素。该计算是在预乘的alpha值上执行的，对于这些值，FF接缝将被错误地舍入

请注意关闭alpha
canvas.getContext（“2d”，{alpha:false}）
的结果像素是FF
[3,46,36255]
和Chrome
[3,45,35255]

Chrome具有如下代码段所示的正确值



//正确的预多重alpha

console.log（[12187146].map（c=>Math.round（c*62/255））+“”）感谢您指出预乘alpha的问题！如果我将alpha字节设置为255，则RGB字节将正确重建。显然，
putImageData
与alpha有关。仅供参考：我已经为Firefox（）创建了一个bug报告。作为记录：可以使用读取图像的准确字节值。