Цветовая интерполяция

Итак, я смотрю на типичное средство выбора цвета, и оно выглядит примерно так:

изображение

Если мы имеем дело только с очень насыщенными цветами, шаблон смешивания ведет себя следующим образом:

R 255  
G 0  
B 0  

R 255  
G 0 -> 255  
B 0  

R 255  
G 255  
B 0  

R 255 -> 0  
G 255  
B 0  

R 0  
G 255  
B 0  

R 0  
G 255  
B 0 -> 255  

R 0  
G 255  
B 255  

R 0  
G 255 -> 0  
B 255  

R 0  
G 0  
B 255  

R 0 -> 255  
G 0  
B 255  

R 255  
G 0  
B 255  

R 255  
G 0  
B 255 -> 0  

R 255  
G 0  
B 0  

Можно ли определить интерполирующую функцию f, которая принимает значение от 0 до 1 и производит цвет в этом спектре (где 0 и 1 соответствуют левой и правой частям спектра, приведенным выше)? Меня интересуют только очень насыщенные цвета (один компонент всегда 255). Кроме того, я заметил, что этот шаблон смешивается от R к G и B. Однако есть ли аналогичная функция, которая смешивает голубой, пурпурный и желтый? И хотя это неверно, если f(0) дает голубой цвет, а f(1) — желтый, то f(0,5) будет давать зеленый цвет, подобный тому, который можно получить, если смешать две краски.

Я надеюсь в этом есть смысл. Пожалуйста, не стесняйтесь, чтобы я что-нибудь разъяснил. Спасибо!


person Community    schedule 08.09.2009    source источник
comment
Добро пожаловать в StackOverflow! Я добавил изображение для вас. Надеюсь, это поможет.   -  person Lucas Jones    schedule 08.09.2009
comment
Спасибо! Это было быстро!   -  person    schedule 08.09.2009
comment
en.wikipedia.org/wiki/HSL_and_HSV может помочь. Где диапазон 0-1, который вы хотели, составляет 0-360 градусов.   -  person Pod    schedule 08.09.2009
comment
@Pod: Это именно то, что ему нужно - должен быть ответ, а не комментарий.   -  person mbeckish    schedule 08.09.2009
comment
Да это правильно! Итак, существует ли схема, которая больше похожа на электромагнитный спектр (ROYGBIV)?   -  person    schedule 08.09.2009
comment
Ой! Это не то, что я имел ввиду. Это то, что делает HSL. На самом деле я хочу что-то вроде цветового круга художника.   -  person    schedule 08.09.2009
comment
Ах, опять неважно. Они почти одинаковы. ХСЛ - это то, что мне нужно.   -  person    schedule 08.09.2009


Ответы (2)


http://www.w3.org/TR/css3-color/#hsl-color объясняет HSL для скудной сети CSS3 и включает простую реализацию HSL->RGB.

person joeforker    schedule 08.09.2009
comment
Прохладный! Да, похоже, что моя функция в HSL — это просто оттенок от минимального до максимального, в то время как насыщенность остается постоянной. Однако существует ли схема, более точно соответствующая электромагнитному спектру (ROYGBIV)? - person ; 08.09.2009

В некоторых случаях HSL может быть лучше, чем RGB, но HCL лучше визуально. Это более затратно в вычислительном отношении, но вы можете использовать его в качестве промежуточного шага. Стандартная функция интерполяции всегда:

C(x) = (1.0 - x) * color_1 + x * color_2, where x in (0.0, 1.0)

Вы хотите сделать это для каждого компонента, где красный зеленый и синий или оттенок, насыщенность и значение.

R(x) = (1.0 - x) * color_1.red + x * color_2.red
G(x) = (1.0 - x) * color_1.green + x * color_2.green
B(x) = (1.0 - x) * color_1.blue + x * color_2.blue

Где каждый компонент может быть нормализован (от 0.0 до 1.0) или прямо от 0.0 до 255.0.

При использовании значений RGB промежуточные результаты могут отличаться от тех, которые вы хотите получить визуально. Однако численные результаты всегда должны быть. Другими словами, значения R G и B должны плавно перемещаться от начальных к конечным числам. Однако визуально это может привести к нежелательным оттенкам серого, и именно здесь сияет HCL.

Ознакомьтесь с этим руководством, в котором я подробно расскажу об этом.

person Mike M    schedule 06.11.2017