Question

我一直在寻找一种方法来改变d3.js中不同类别的默认颜色。

我找到了主要d3.js中的颜色布局。对于一个类别，它们看起来像这样：

var ml = [2062260, 16744206, 2924588, 14034728, 9725885, 9197131, 14907330, 8355711, 12369186, 1556175].map(yt)

我已尝试将这些值替换为从Hex代码到HSL到RGB的所有内容，并且它永远不会产生预期的颜色。

任何想法如何为我想要的任何颜色生成正确的数字？

感谢。

Answer 1

首先，只是FYI，要查看与这些数字对应的RGB（即十六进制）值：

(2062260).toString(16); // 16 for hex, aka base 16
> "1f77b4"

接下来，给出要转换为数字的RGB（同样，十六进制）：

parseInt("1f77b4", 16); // 16 for hex
> 2062260

这就是你想要使用的数字。

您从d3源获得的颜色用于构建您从d3.scale.category10()获得的颜色。您可以使用自己的颜色获得相同的东西 - 而无需修改d3的源代码 - 通过构建d3.scale.ordinal：

var myCategory3 = d3.scale.ordinal()
  .domain(["red", "#1f77b4", "rgb(128, 255, 128)"]);// All kinds of colors are possible

myCategory3("X");// "red"
myCategory3("blabla");// "#1f77b4"
myCategory3("X");// "red"
myCategory3(123456);// "rgb(128, 255, 128)"

更改默认d3.js颜色

1 个答案: