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

Brewer scales does not seem accurate #316

Closed
yohanboniface opened this issue Jul 1, 2023 · 1 comment · Fixed by #351 · May be fixed by WontonSam/style-dictionary#218 or WontonSam/style-dictionary#247
Closed

Brewer scales does not seem accurate #316

yohanboniface opened this issue Jul 1, 2023 · 1 comment · Fixed by #351 · May be fixed by WontonSam/style-dictionary#218 or WontonSam/style-dictionary#247
Milestone

Comments

@yohanboniface
Copy link

Hi!

When using this example from the documentation:

>> chroma.scale('OrRd').colors(5);
Array(5) [ "#fff7ec", "#fdd49e", "#fc8d59", "#d7301f", "#7f0000" ]

I would expect it to return the same colors as ColorBrewer would do:

image

But the results differ:

  • chroma-js: #fff7ec, #fdd49e, #fc8d59, #d7301f, #7f0000
  • ColorBrewer: #fef0d9, #fdcc8a, #fc8d59, #e34a33, #b30000

When I look at the chroma-js code handling this, it seems to me that indeed the brewer management is simplified. But I'm not sure at this point if this is a bug or a feature (to keep the code simple). And also I may be missing something.

So if this is considered as a bug, I can try to work on a proposal. If it's a feature, let's close! And if I'm misunderstandin something, sorry for the noise!

@gka
Copy link
Owner

gka commented Aug 17, 2024

I know that the official brewer scales are hand-picked colors that vary depending on how many colors you want to use in your visualization. In chroma.js we're using the versions with the most colors (e.g. 9 colors for sequential scales) and then interpolating between them.

The idea is to get you close to ColorBrewer while allowing you to switch to any number of "steps" you want. If you want to use exactly the 5-color scale from https://colorbrewer2.org/ you can just copy those colors and use them, and don't need chroma.js at all.

But it's worth adding a note about this to the documentation.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment