离散条形图颜色 nvd3.js答案

【问题标题】：Discrete Bar Chart colors nvd3.js离散条形图颜色 nvd3.js
【发布时间】：2013-07-17 19:16:47
【问题描述】：

我用的是nvd3.js离散条http://nvd3.org/ghpages/discreteBar.html

我正在检查代码，发现颜色是内联派生的

style="fill: #ffbb78; stroke: #ffbb78;"

我还跟踪了discreteBarChart函数

color = nv.utils.getColor()

我没有意识到和问的是颜色作为参数是什么？

【问题讨论】：

标签： nvd3.js

【解决方案1】：

它需要颜色数组 => ['#aec7e8', '#7b94b5', '#486192'] ，这样的东西会起作用。

var chart = nv.models.discreteBarChart()
                   .... 
                   ....
                   .color(['#aec7e8', '#7b94b5', '#486192']);

NVD3 继承 d3 here 设置的默认颜色

希望对你有帮助。

【讨论】：

color() 设置每个数据集的颜色，而 barColor() 设置每个组的颜色（使用自动不同的阴影使条形可区分）。它们都采用颜色数组。

【解决方案2】：

如果你想使用一种单一的颜色，那么它可以从选项对象中返回，如下所示：

var options={
 ....
 colour:function(){
 return '#ff0000';
 },
 ...
 ..
}

【讨论】：