Вопрос по language-agnostic, colors, hash – Строка хеша в цвет RGB

42

Есть ли лучший совет о том, как хэшировать произвольную строку в значение цвета RGB? Или быть более общим: до 3 байтов.

Вы спрашиваете: когда мне это понадобится? Это не имеет значения для меня, но представьте себе эти графики на любом GitHubсетевая страница, Там вы можете увидеть что-то вроде этого:

git branches

Где каждая цветная линия означает отдельную ветвь. Низкотехнологичный подход к окраске этих ветвей - CLUT (таблица соответствия цветов). Более сложная версия будет:

$branchColor = hashStringToColor(concat($username,$branchname));

Потому что вам нужен статический цвет каждый раз, когда вы видите представление ветвей. И для бонусных баллов: Как вы обеспечиваете равномерное распределение цвета этой хэш-функции?

Так что ответ на мой вопрос сводится к реализацииhashStringToColor().

Ваш Ответ

5   ответов
2

В качестве примера,это как Java вычисляет хеш-код строки (строка 1494 и последующие). Возвращаетint, Затем вы можете рассчитать по модулю этогоint с 16 777 216 (2 ^ 24 = 3 байта), чтобы получить «RGB-совместимый»; число.

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

Error: User Rate Limit Exceeded
Error: User Rate Limit Exceeded Jens Kohl
9

Я попробовал все решения, предоставленные другими, но обнаружил, что похожие строки (string1 vs string2) производят цвета, которые слишком похожи на мой вкус. Поэтому я построил свой собственный под влиянием вклада и идей других.

Он вычислит контрольную сумму MD5 строки и возьмет первые 6 шестнадцатеричных цифр, чтобы определить 24-битный код RGB.

Функциональность MD5 - это плагин JQuery с открытым исходным кодом. Функция JS работает следующим образом:

function getRGB(str){
    var hash = $.md5(str);
    var rgb = '#' + hash.substring(0,2) + hash.substring(2,4) + hash.substring(4,6);
    return rgb;
}

Ссылка на этот рабочий пример находится наjsFiddle, Просто введите строку в поле ввода и нажмите клавишу ввода, и делайте это снова и снова, чтобы сравнить свои результаты.

I tried all the solutions others provided (…)Error: User Rate Limit ExceededinfiniteError: User Rate Limit Exceeded
Error: User Rate Limit Exceededvar rgb = '#' + hash.substring(0,6);
6

Я просто создаю библиотеку JavaScript с именем color-hash, которая может генерировать цвет на основе заданной строки (используя цветовое пространство HSL и BKDRHash).

Repo:https://github.com/zenozeng/color-hash
Демо-версия:https://zenozeng.github.io/color-hash/demo/

23

Для любых пользователей Javascript я объединил принятый ответ от @ jeff-foster сdjb2 хэш-функция отerlycoder.

Результат по вопросу:

function djb2(str){
  var hash = 5381;
  for (var i = 0; i < str.length; i++) {
    hash = ((hash << 5) + hash) + str.charCodeAt(i); /* hash * 33 + c */
  }
  return hash;
}

function hashStringToColor(str) {
  var hash = djb2(str);
  var r = (hash & 0xFF0000) >> 16;
  var g = (hash & 0x00FF00) >> 8;
  var b = hash & 0x0000FF;
  return "#" + ("0" + r.toString(16)).substr(-2) + ("0" + g.toString(16)).substr(-2) + ("0" + b.toString(16)).substr(-2);
}

UPDATE: Исправлена ошибка, из-за которой возвращаемая строка всегда возвращала шестнадцатеричную строку формата # 000000, основанную на редактировании @alexc (спасибо!).

Error: User Rate Limit Exceeded
Error: User Rate Limit Exceeded
Error: User Rate Limit Exceeded
28

Хорошая хеш-функция обеспечит практически равномерное распределение по ключевому пространству. Это сводит вопрос о том, как преобразовать случайное 32-разрядное число в 3-байтовое пространство RGB. Я не вижу ничего плохого в том, чтобы просто брать младшие 3 байта.

int hash = string.getHashCode();
int r = (hash & 0xFF0000) >> 16;
int g = (hash & 0x00FF00) >> 8;
int b = hash & 0x0000FF;
Error: User Rate Limit Exceeded
Error: User Rate Limit Exceeded
Error: User Rate Limit Exceeded

Похожие вопросы