HTML5 Canvas - полоса с низким альфа? - PullRequest
Новая
       35

HTML5 Canvas - полоса с низким альфа?

2 голосов
/ 24 января 2011

Введение

В настоящее время я занимаюсь разработкой небольшого приложения для рисования, похожего на Sketchpad в MugTug.Однако есть одна довольно неприятная проблема, которую мне пока не удалось обойти.

Алгоритм рисования

Мой основной алгоритм рисования похож на тот, который используется в MugTug.По сути, он просто маркирует изображения, используя drawImage, пока пользователь рисует.Есть один серьезный недостаток.Алгоритм начинает давать сбой при низком альфа.

Это легко увидеть в инструменте MugTug, установив настройки кисти следующим образом: диаметр -> 100, твердость -> 1, расход -> 100, непрозрачность -> 2 (1 слишком мало! Ошибка в приложении?).

Существуют две основные проблемы: 1. Видимая полоса.2. Сдвиги цветов (посмотрите, как это работает ...)

Вопросы

Может ли проблема быть связана с точностью цвета?Мне кажется, что Canvas API обрабатывает цвета с использованием 8-битных каналов (т. Е. 0-255).Есть ли способ обойти это ограничение?Я бы предпочел использовать чистые плавающие цвета (0,0-1,0) вместо этого, если это возможно.

Любые идеи о том, как бороться с этим, приветствуются.Если цвет действительно ограничен 8-битными каналами, думаю, мне не повезло ...

Ответы [ 2 ]

2 голосов
/ 24 января 2011

Эта проблема, кажется, полностью связана с точностью цвета. Я думаю, что большинство реализаций Canvas API используют 8-битные каналы RGBA. Непрозрачность 1% или 2% означает, что вы наносите очень небольшое количество цвета на изображение, разница составляет всего 2-5 уровней, поэтому даже после многократного применения кисти любые цвета, которые вы используете, в конечном итоге будут квантуется до меньшего числа.

Вы можете создать свой собственный холст с плавающей точкой и копировать его в обычный холст после каждого изменения. Это сделает проблему совершенно незаметной для большинства операций. Вам придется реализовать свои собственные операции рисования (не так уж плохо, если вы используете только drawImage), и они, вероятно, будут медленнее, чем холст.

1 голос
/ 24 января 2011

Видите ли вы похожие проблемы на Sketchpad MugTug?Я пробовал с 4% альфа-синей кистью на оранжевом фоне, и есть полосы и тому подобное.Если он работает лучше, чем вы, то вы делаете что-то не так.

Я всегда видел холст, работающий с 32-битной графикой (24 для цвета + 8 для альфы), поэтому я сомневаюсь, что это можно решить.

...