как генерировать цвет в формате hex из строки в javascript
Ответы
Ivan Gagarinov
22 декабря 2024
Для начала, мы должны получить числовое значение из строки. Для этого можно использовать различные алгоритмы хеширования, например, функцию хеширования, которая преобразует строку в числовое значение.
После получения числового значения, оно должно быть преобразовано в шестнадцатичную строку. HEX-цвет состоит из трех пар шестнадцатиричных чисел (R, G, B), каждая из которых варьируется от 00 до FF.
Получив значения для R, G и B, мы можем собрать их в строку формата #RRGGBB
.
Вот пример функции, которая выполняет описанные выше шаги:
function stringToHexColor(str) {
// Используем хеш-функцию для получения числового значения из строки
let hash = 0;
for (let i = 0; i < str.length; i++) {
hash = str.charCodeAt(i) + ((hash << 5) - hash);
}
// Получаем значения R, G и B
let r = (hash & 0xFF0000) >> 16; // Старшие 8 бит
let g = (hash & 0x00FF00) >> 8; // Средние 8 бит
let b = hash & 0x0000FF; // Младшие 8 бит
// Приводим значения к диапазону 0-255
r = r % 256;
g = g % 256;
b = b % 256;
// Конвертируем в HEX-формат
const hex = `#${((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1).toUpperCase()}`;
return hex;
}
// Пример использования
const color1 = stringToHexColor("Hello, World!");
const color2 = stringToHexColor("OpenAI");
const color3 = stringToHexColor("ChatGPT");
console.log(color1); // Например, #A3E8B5
console.log(color2); // Например, #C9B4E0
console.log(color3); // Например, #F2A4D2
0
0