Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Setting seed does not return same set of colours! #132

Open
EthanSK opened this issue Mar 7, 2020 · 4 comments
Open

Setting seed does not return same set of colours! #132

EthanSK opened this issue Mar 7, 2020 · 4 comments
Labels

Comments

@EthanSK
Copy link

EthanSK commented Mar 7, 2020

If I set count = 5, and generate the colours twice with same seed, they give a different list of colours!

@davidmerfield
Copy link
Owner

davidmerfield commented Jul 14, 2020

Hello Ethan, thank you for this report.

Which version of the library are you using (you can find this in your copy of this repo's package.json file).

And what seed input are you using? It would be great if you could share your full usage of the script, e.g.

randomColor({count: 5, seed: 'foo'});

@sanyavanya
Copy link

I'm having the same issue. If I just reload the page, the color stays the same, but if I change anything in the code (even if it's not related to the color generating options), the color changes every time, despite passing the same seed. And it doesn't seem to matter whether I pass the seed as an argument or hard-code it. I have a small util that goes like this:

const randomColor = require('randomcolor');
export const generate = (length, seed) => randomColor({
    count: length,
    luminosity: 'bright',
    hue: 'random',
    seed: seed
});

export const generateOne = () => randomColor({
    luminosity: 'bright',
    hue: 'random',
    seed: '1'
});

But even if I call randomColor directly in my components, the problem doesn't go away. Modifying any surrounding code breaks same-color generation from seed.

@sanyavanya
Copy link

sanyavanya commented Oct 20, 2020

I think it only breaks on hot reload. If I refresh the page manually, the seed seems to generate consistent colors every time. My project is on Vue 2.

@codebycarlos
Copy link

codebycarlos commented Oct 21, 2022

I was having the same issue with React. The solution was to memoize the result so that randomcolor only runs once on re-renders.

i.e.. instead of

const colors = randomColor({
                count: 1,
                seed: 'hello',
               });

try

const colors = useMemo(
  () =>
    randomColor({
      count: 1,
      seed: 'hello',
    }),
  []
);

Edit: Scrap that. Even with memoisation I was still running into issues. I then tried your version @sanyavanya, but kept getting:

image

So I did two things that fixed it (at least for React).

  1. Always pass the reset option as true to randomColor.
  2. Store the results in state with the seed as a key so it can be retrieved for later instead of re-generating.

Would be interesting to create a hook version of randomcolor...

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

4 participants