HTML5 Canvas рисует пиксели с цветом, отличным от предоставленного

Question

После установки определенного цвета в качестве fillStyle холста и рисования прямоугольника с fillRect, цвет прямоугольника иногда немного отличается от предоставленного (getImageData возвращает разные значения - обычно одно из них меньше на 1). Кажется, это происходит только при использовании rgba цвета (а не с rgb) но мне на самом деле нужно использовать альфа-канал.

Я сделал простой набор тестов на js fiddle для всех, кто хотел бы изучить эту проблему: http://jsfiddle.net/LaPdP/1/

Любые идеи о том, почему это происходит и есть ли способ это исправить? Если бы это, по крайней мере, всегда происходило с одним и тем же значением, я бы просто обошел его, увеличив его на 1, но мне это кажется совершенно случайным.

Answer 1

Обновление с 2017 года: я полностью забыл об этом ответе, но причина связана с предварительным умножением данных при получении / настройке. Поскольку числа в растровом изображении всегда целочисленные, будут ошибки округления, поскольку естественный результат предварительного умножения часто приводит к нецелым числам.

К сожалению, нет удобного способа исправить это.

Просто чтобы прояснить гамму ниже: Гамма (через настройку гаммы или профиль ICC) будет влиять на изображения напрямую, но для форм, нарисованных непосредственно на холсте, это не должно быть проблемой само по себе, поскольку только гамма дисплея регулируется сверху, не сами данные.

Старый ответ:

То, что вы испытываете, вероятно, является результатом лишь частичной реализации раздела коррекции цвета и гаммы в стандарте холста.

Причина различных значений цвета, по крайней мере, когда речь идет об изображениях, содержащих профили ICC, связана со встроенной коррекцией цвета и гаммы в браузерах:

4.8.11.1 Цветовые пространства и коррекция цвета

API холста должны выполнять коррекцию цвета только в двух точках: при рендеринге изображений с собственной гамма-коррекцией и информацией о цветовом пространстве на холст, чтобы преобразовать изображение в цветовое пространство, используемое холстом (например, с помощью метода drawImage() 2D-контекста). с объектом HTMLImageElement) и при рендеринге фактического растрового изображения холста на устройство вывода.

Источник: w3.org

Однако в разделе 4.8.11.1 также говорится:

Примечание. Таким образом, в 2D-контексте цвета, используемые для рисования фигур на холсте, будут точно соответствовать цветам, полученным с помощью метода getImageData().

Поскольку статус, как это написано, является work in progress Я предполагаю, что в браузерах реализована "ленивая" реализация коррекции цвета и гаммы, которая в настоящее время также влияет на фигуры - или - вся информация о цвете с холста корректируется для отображения профиля в качестве последней точки в первой цитате. Возможно, это не изменится, пока стандарт не станет окончательным.