如何为 D3 条形图分配随机颜色？答案

【问题标题】：How to assign random colors to D3 bar chart?如何为 D3 条形图分配随机颜色？
【发布时间】：2014-02-17 05:17:19
【问题描述】：

我正在按照下面的模型制作 D3 条形图：

如何使条形图具有随机颜色？

代码：

svg.append("g")
.attr("class", "x axis")
.attr("transform", "translate(0," + height + ")")
.call(xAxis);

【问题讨论】：

标签： javascript d3.js

【解决方案1】：

d3 有 4 个内置调色板。

这是内置调色板的link。

This 教程非常适合为特定元素使用特定颜色。

Jerome Cukier 的另一个 tutorial。

还有官方site d3 颜色。

Fiddle - 注意：在小提琴中，我通过在数据中添加颜色来传递颜色。

甚至可以通过传递不同变量的颜色来完成。

希望这会有所帮助。

【讨论】：

如何在条形背景中添加显示 Y 轴全比例的灰度？
我不清楚。您想添加水平网格线吗？
不，如果您考虑问题快照中的单个条形，则它具有与 Y 轴平行的灰度，类似于 100%。如何将其添加到我的图表中？
你能为此开一个新帖子吗？请用小提琴来做，因为我不是你现在问的专家，但我会试一试。其他人也可能会帮助你。
这里：stackoverflow.com/questions/21823226/…

【解决方案2】：

colors = d3.scale.category20()

rects = svg.selectAll('rect')
                .data(data)
                .enter()
                .append("rect")
                .attr("class","rect")
                .....#other attributes
                .attr("fill",function(d,i){return colors(i)})

【讨论】：

【解决方案3】：

这已经过时了，但如果你需要 N 种随机颜色，这是一个很好的方法

http://bl.ocks.org/jdarling/06019d16cb5fd6795edf

【讨论】：