nvd3.js - 无法更改散点图中符号的颜色

时间:2014-04-10 15:42:17

标签: javascript d3.js nvd3.js scatter-plot color-scheme

我正在尝试更改nvd3散点图here的不同组的颜色,但我无法理解如何操作。我想将示例中4系列的颜色更改为橙​​色,绿色,黄色,红色。

    nv.addGraph(function() {
    chart = nv.models.scatterChart()
    .showDistX(true)
    .showDistY(true)
    .color( d3.scale.category10().range() ); //  tried to change to green, orange here but it did not work 
    };

我试过

        .color( d3.rgb("green"), d3.rgb("orange") ); 

然后情节甚至没有出现。我是javascript的新手。如果它太简单,请原谅我的错误。

修改

我也想知道如何根据RGB值选择颜色。

由于

1 个答案:

答案 0 :(得分:2)

颜色功能采用一系列颜色。对于散点图,这相当于每个数据组一种颜色。

如果您将其更改为

nv.addGraph(function() {
chart = nv.models.scatterChart()
.showDistX(true)
.showDistY(true)
.color(  [d3.rgb("green"), d3.rgb("orange")] ); 
};

它似乎可以按你的需要工作。

编辑 - 使用RGB字符串设置颜色

这可以使用css语法

完成
 nv.addGraph(function() {
chart = nv.models.scatterChart()
.showDistX(true)
.showDistY(true)
.color(  ["rgb(0,255,0)","rgb(255,165,0)"] ); 
};

您最好阅读https://github.com/novus/nvd3/wiki/API-Documentation

上的API文档