更改dc.js图表颜色

Question

为什么所有的dc.js图表都是蓝色的？我该怎么改呢？通过dc.css，没有看到太多的蓝色在那里使用！

我尝试更改了相当多的fill属性。我唯一成功的就是条形图。派图上还是没有线索。

Answer 1

dc.js中的颜色(通常是d3中的颜色)是根据数据动态计算的，这就是为什么您通常不会在CSS中找到它们的原因。这需要一些习惯。

在条形图中，颜色是基于堆栈号的。在饼图中，它们是基于饼片的。

然后，他们通过一个d3比例，以分配实际的颜色。通常，您希望使用chart.ordinalColors将颜色刻度替换为自己的颜色。

因此，例如使用一个彩色酿酒调色板：

chart.ordinalColors(['#e41a1c','#377eb8','#4daf4a','#984ea3','#ff7f00','#ffff33','#a65628']);

同样地，由于彩色酿酒调色板包含在D3v4+中：

chart.ordinalColors(d3.schemeSet1);

(许多美妙的色彩方案在d3的规模-色。)

在下面，ordinalColors正在这样做：

chart.colors(d3.scaleOrdinal().range(d3.schemeSet1));

因此，如果您想控制颜色的顺序，也可以指定域：

chart.colors(d3.scaleOrdinal().domain([5,4,3,2,1]).range(d3.schemeSet1));