javascript - 类别的 D3 颜色和每个子类别的相似颜色

Question

我有一个像这样的数据结构:

{
  id: X
  subId: Y
}

id 应该决定它应该是什么样的颜色(绿色、蓝色、红色、黄色)。 d3.scale.category10() 应该足够了。

从这个颜色中，我希望每个 subId 都有“子颜色”(不同的蓝色、不同的绿色)(它们看起来越不同越好 - 然而，看到 id 之间的差异比看到 subId 之间的差异更重要)。

我该如何解决这个问题？

Answer 1

您可以使用 D3 的 .brighter()和/或 .darker() 函数来修改从类别比例中获得的颜色。请注意，这两个函数都带有一个参数，允许您控制颜色变亮/变暗的程度(值小于 1)。