Automatically pick N distinct colors? about d3-color HOT 6 CLOSED

The thing is, you’re never going to want more than 10 hues for categorical colors.* You might get more than that if you vary lightness as well, such as category20 which pairs light and dark, and category20b and category20c which have four shades per hue. But then you have to be careful about the semantic association caused by the grouping.

So, I find that in practice a handful of hand-picked hues are going to outperform automatic selection. I can see that sometimes it’s nice to start with a different set of hues if you want to match a particular aesthetic. But it’s rare that you want to pick equidistant hues in HCL or some such, since the hand-picked ones are often going to look better and perform at least as well.

*Just like you’re never going to want more than 640KB.

from d3-color.

Thank you for your thoughts on this. You make very good points.

I think I'll close this issue then, as it seems like the idea of automatically picking N colors is more of an academic curiosity than a practical need.

from d3-color.

@mbostock @curran As I have run into the need for more than 10, I decided to comment on this issue.

Here is the case: I need 20 colors for 20 topics that were created by LDA. I have limited my soft topics to 20 because I wanted to use 20 or 20c as my scale. Now here is my problem: with 20 topics:

And with 2 topics:

If I had more than 20 colors, I would certainly upgrade the limit to 25 or 30.

Any thoughts as to what extent can we actually have distinct colors?
I am creating a custom scale but your feedback would be much appreciated.

from d3-color.

@armandidandeh I did something rather crazy and generated a color scale with something like 200 different hues, like this:

export default scaleOrdinal()
  .domain(allCountries)
  .range(allCountries.map((country, i) => {
    const t = i / allCountries.length;
    return hcl(t * 360, 50, 70);
  }));

From https://github.com/unhcr/dataviz-streamgraph-explorer/blob/master/src/colorScale.js

It worked OK, but probably you can't differentiate all of them.

Tamara Munzner says a good rule of thumb is not more than 12 colors, from Visualization Analysis and Design.

from d3-color.

@curran thanks for the input. Agreed but 12 is not realistic.
I once did something very similar to your code using a hypercube idea a few years back but as you said, not very practical as well.

from d3-color.

after a bit of thinking the algorism should be considering colors as a simi cone
its topmost point is black
its base circle is hue
the most bottom point of the cup is white
the diameter of the hue circle equals the distance from black to white

...
when ever you come near the base center the color becomes lighter
when ever you move towards the top of the cone the color becomes darker

the algorism should pick up n points in this simi cone, farest from each other
...
in the beginnig it will be easy, picking the top most point(black), and some of the base points
...
but after a while, you will need to go upwards to distripute fine your colors using the whole body of, colors like black, navy, dark red, maroon and so on
...
this can be done manualy from the pie i learned from you, and i added to it a tooltip

from d3-color.