html5+canvas+颜色,javascript – HTML5 Canvas绘制的颜色与提供的颜色不同

2017年更新：我完全忘记了这个答案,但原因与获取/设置时预先倍增数据有关.由于位图中的数字总是整数,因此预乘会的自然结果通常会导致非整数,因此会出现舍入误差.

遗憾的是,没有方便的方法来解决这个问题.

只是为了澄清下面的伽玛：Gamma(通过伽玛设置或ICC配置文件)将直接影响图像,但对于直接绘制到画布的形状,这不应该是一个问题本身,因为只有显示器伽玛在顶部调整,不是数据本身.

老答案：

您遇到的可能是仅在画布标准中部分实现颜色和伽马校正部分的结果.

各种颜色值的原因,至少在涉及包含ICC配置文件的图像时,是由于浏览器中的内置颜色和伽马校正：

4.8.11.1 Color spaces and color correction

The canvas APIs must perform color correction at only two points: when

rendering images with their own gamma correction and color space

information onto the canvas, to convert the image to the color space

used by the canvas (e.g. using the 2D Context’s drawImage() method

with an HTMLImageElement object), and when rendering the actual canvas

bitmap to the output device.

但是,它也在第4.8.11.1节中说明：

Note: Thus, in the 2D context, colors used to draw shapes onto the

canvas will exactly match colors obtained through the getImageData()

method.

由于写入的状态是正在进行的工作,我的猜测是浏览器具有颜色和伽马校正的“懒惰”实现,其当前也影响形状 – 或者 – 来自画布的所有颜色信息被校正为显示简档作为第一个引用的后一点.在标准成为最终标准之前,这可能不会改变.