Próbuję wygenerować 2 losowe kolory dla raportów wykresów, wywołując tę funkcję dwukrotnie:

function randomNumberGenerator() {
        let color_x = Math.floor(Math.random() * 256);
        let color_y = Math.floor(Math.random() * 256);
        let color_z = Math.floor(Math.random() * 256);
        return `rgba(${color_x}, ${color_y}, ${color_z}, 0.6)`;
}

Wszystko działa dobrze, ale problem jest taki:

Czasami ta funkcja generuje 2 losowe liczby zbliżone do samego koloru, na przykład szare i jasnoszare.

To, co próbuję zrobić, to uzyskać dwa losowe kolory zupełnie nie zbliżone do siebie, na przykład: niebieski i czerwony lub ciemnopomarańczowy i zielony.

0
Jaad 12 marzec 2020, 18:34

2 odpowiedzi

Najlepsza odpowiedź

Kilka możliwych rozwiązań alternatywnych:

  • Użyj czegoś w rodzaju triadycznego schematu kolorów i pozwól losowej wartości wybrać początkowy kolor, a reszta jest algorytmiczna. Jest to szczególnie łatwe, jeśli używasz HSL ... losowo wybierz odcień, wtedy kolor drugorzędny znajduje się o kilka stopni od początkowego odcienia.
  • Użyj HSL zamiast RGB dla swojego losowego, ze stałym nasyceniem i jasnością i tylko losowo dobieraj odcień.
  • Napisz funkcję, która określa, jak blisko są kolory (pod względem HSL, prawdopodobnie nie RGB) i wygeneruj ponownie, jeśli są zbyt blisko.
1
Brad 12 marzec 2020, 15:39

Można to zrobić na wiele sposobów. Tu jest jeden:

Zadzwoń raz do swojej funkcji. określ x, y i z tak jak obecnie. Dla drugiego koloru kwadratu x, y i z, a następnie zmodyfikuj każdy z 256 dla drugiego koloru

0
DCR 12 marzec 2020, 15:39