Исследование преобразования цветовых значений HSB в RGB

Beginner

This tutorial is from open-source community. Access the source code

Введение

В этом практическом занятии мы изучим процесс преобразования цветовых значений HSB в RGB с использованием JavaScript. Мы узнаем, как преобразовать значения цветовой модели HSB в формат RGB с использованием формулы и привести выходные значения в соответствующий диапазон. В конце практического занятия у вас будет лучше понимание цветовых моделей и способов работы с ними в JavaScript.

Преобразование HSB в RGB

Для преобразования кортежа цветовых значений HSB в формат RGB следуйте этим шагам:

  • Откройте Терминал/SSH и введите node, чтобы начать практиковаться в написании кода.
  • Используйте формулу преобразования HSB в RGB, чтобы преобразовать в соответствующий формат.
  • Входные параметры должны находиться в диапазоне: H: [0, 360], S: [0, 100], B: [0, 100].
  • Все выходные значения должны находиться в диапазоне [0, 255].

Вот код, который вы можете использовать для преобразования HSB в RGB:

const HSBToRGB = (h, s, b) => {
  s /= 100;
  b /= 100;
  const k = (n) => (n + h / 60) % 6;
  const f = (n) => b * (1 - s * Math.max(0, Math.min(k(n), 4 - k(n), 1)));
  return [255 * f(5), 255 * f(3), 255 * f(1)];
};

Например, если вы хотите преобразовать кортеж цветовых значений HSB (18, 81, 99) в формат RGB, вы можете использовать следующий код:

HSBToRGB(18, 81, 99); // [252.45, 109.31084999999996, 47.965499999999984]

Резюме

Поздравляем! Вы завершили практическое занятие по преобразованию HSB в RGB. Вы можете выполнить больше практических занятий в LabEx, чтобы улучшить свои навыки.