Я пишу Java-игру и хочу внедрить измеритель мощности для того, как сильно вы собираетесь что-то снимать.
Мне нужно написать функцию, которая принимает значение от 0 до 100, и в зависимости от того, насколько высоко это число, оно будет возвращать цвет между зеленым (0 на шкале мощности) и красным (100 на шкале мощности).
Аналогично тому, как работают регуляторы громкости:
Какую операцию нужно выполнить для красного, зеленого и синего компонентов цвета, чтобы создать цвета между зеленым и красным?
Таким образом, я могу выполнить getColor(80)
команду сказать, и она вернет оранжевый цвет (его значения в R, G, B) или getColor(10)
который вернет более зеленое / желтое значение RGB.
Я знаю, что мне нужно увеличить компоненты значений R, G, B для нового цвета, но я не знаю точно, что повышается или понижается по мере смещения цветов от зелено-красного.
Прогресс:
В итоге я использовал цветовое пространство HSV / HSB, потому что мне больше понравился градиент (в середине нет темных коричневых оттенков).
Функция, которую я использовал, была:
public Color getColor(double power)
{
double H = power * 0.4; // Hue (note 0.4 = Green, see huge chart below)
double S = 0.9; // Saturation
double B = 0.9; // Brightness
return Color.getHSBColor((float)H, (float)S, (float)B);
}
Где «сила» - это число от 0,0 до 1,0. 0.0 вернет ярко-красный, 1.0 вернет ярко-зеленый.
Java Hue Chart:
Ответы:
Это должно работать - просто линейно масштабируйте красные и зеленые значения. Предполагая , что ваш максимальный красный / зеленый / синий значение
255
, иn
находится в диапазоне0 .. 100
(Исправлено для целочисленной математики, наконечник шляпы для Ферруччо)
Другой способ сделать это - использовать цветовую модель HSV и переключать оттенок от
0 degrees
(красного) до120 degrees
(зеленого) с любой насыщенностью и значением, которое вам подходит. Это должно дать более приятный градиент.Вот демонстрация каждого метода - верхний градиент использует RGB, нижний использует HSV:
источник
Вверху моей головы, вот переход зелено-красного оттенка в пространстве HSV, переведенный в RGB:
Значения красного, зеленого и синего в приведенном выше примере представляют собой проценты, вы, вероятно, захотите умножить их на 255, чтобы получить наиболее часто используемый диапазон 0-255.
источник
Короткий ответ Copy'n'Paste ...
На Java Std:
На Android:
примечание: значение - это число от 0 до 1, обозначающее состояние от красного к зеленому.
источник
String.format("#%06X", 0xFFFFFF & getTrafficlightColor(value));
Если вам нужно зелено-желто-красное представление, как предлагает принятый ответ, взгляните на это.
http://jsfiddle.net/0awncw5u/2/
источник
Линейная интерполяция между зеленым и красным почти должна работать, за исключением того, что посередине будет мутный коричневый цвет.
Самое гибкое и наиболее привлекательное решение - иметь где-то файл изображения с нужной вам цветовой шкалой. А затем посмотрите значение пикселя там. Это имеет гибкость, что вы можете настроить градиент, чтобы быть просто правильным .
Если вы все еще хотите сделать это из кода, то, вероятно, лучше всего интерполировать между зеленым и желтым цветами с левой стороны и между желтым и красным с правой стороны. В пространстве RGB зеленый - это (R = 0, G = 255, B = 0), желтый - (R = 255, G = 255, B = 0), красный - (R = 255, G = 0, B = 0 ) - это предполагает, что каждый компонент цвета идет от 0 до 255.
источник
Я сделал небольшую функцию, которая дает вам целочисленное значение rgb для процентного значения:
Таким образом, если currentValue равно 50, а maxValue равно 100, эта функция вернет нужный вам цвет, поэтому если вы зациклите эту функцию процентным значением, значение вашего цвета изменится с зеленого на красный. Извините за плохое объяснение
источник
Принятый ответ даже не ответил на вопрос ...
C ++
Вот простой фрагмент кода C ++ из моего движка, который линейно и эффективно интерполирует между тремя произвольными цветами:
interpolation_factor
Предполагается в диапазоне0.0 ... 1.0
.Предполагается, что цвета находятся в диапазоне
0.0 ... 1.0
(например, для OpenGL).C #
Вот та же функция, написанная на C #:
interpolationFactor
Предполагается в диапазоне0.0 ... 1.0
.Предполагается, что цвета находятся в диапазоне
0 ... 255
.источник
Вам необходимо линейно интерполировать (LERP) цветовые компоненты. Вот как это обычно делается, учитывая начальное значение v0 , конечное значение v1 и требуемое соотношение (нормализованное значение с плавающей запятой между 0,0 и 1,0):
Это дает v0, когда коэффициент равен 0.0, v1, когда коэффициент равен 1.0, и все остальное в других случаях.
Вы можете сделать это либо на компонентах RGB, либо используя другую цветовую схему, такую как HSV или HLS. Последние два будут более визуально приятными, так как они работают на оттенках и яркости, которые лучше соответствуют нашему цветовому восприятию.
источник
Я бы сказал, что вы хотите что-то среднее между отрезком линии в пространстве HSV (у которого слегка слишком яркий желтый цвет в центре) и отрезком линии в пространстве RGB (с уродливым коричневым цветом в центре). Я хотел бы использовать это, где
power = 0
даст зеленый,power = 50
даст слегка тусклый желтый, иpower = 100
даст красный.источник
Вот решение копирования и вставки для весов Swift и HSV:
Инициализатор UIColor принимает оттенок, насыщенность и яркость в [0, 1], поэтому для заданного значения из [0, 1] мы имеем:
источник
источник
Если вам нужен этот вид градиента (фактически обратный) в CSS (мин. Версия 2.1), вы также можете использовать HSL.
Предположим, вы находитесь в шаблоне AngularJs, а значение это число от 0 до 1, и вы хотите стилизовать элемент (цвет фона или текста) ...
Первое значение: градусы (0 красный, 120 зеленых) Второе значение: насыщенность (50% нейтральное) Третье значение: легкость (50% нейтральное)
Хорошая статья здесь
Теория в Википедии здесь
источник
Вот
Objective-C
версия решения Simucal:Где уровень будет значением между
0.0
и1.0
.Надеюсь, это поможет кому-то!
источник
В Python 2.7:
Процент это конечно
value / max_value
. Или если ваша шкала не начинается с 0 тогда(value - min_value) / (max_value - min_value)
.источник
JavaScript
Я использую Google Visualization с гистограммой и хотел, чтобы столбцы были зелеными или красными в процентах. Это оказалось самым чистым решением, которое я нашел и работает отлично.
Просто убедитесь, что ваш процент составляет 50 на 50%, а не 0,50.
источник
Я обновил принятый ответ, разделив его на первую и вторую половину диапазона (0,100) и подставив 100 на максимальный уровень, чтобы диапазон стал динамичным. Результат точно такой же, как с моделью HSV, но все еще использующий RGB. Ключ должен иметь (255,255,0) в середине, чтобы представить желтый цвет. Я объединил эту идею в принятом ответе и другом коде VBA, поэтому достигну его в VBA и использую в Excel. Я надеюсь, что логика помогает и может быть использована в других языках / приложениях.
Ура, Павлин
источник
VB
источник
Автономный пример
источник
Это будет варьироваться от красного до желтого, а затем до зеленого
значения варьируется от 0 до 100
источник