nvd3.js - 无法在散点图中更改符号的颜色 [英] nvd3.js - unable to change color of symbol in scatter plot

问题描述

我尝试更改nvd3散点图的不同组的颜色此处但我不能理解如何这样做。我想将示例中的4系列的颜色更改为橙​​色，绿色，黄色，红色。

I am trying to change the colors of different groups of the nvd3 scatter chart here but am unable to understand how to do so. I would like to change the colors of the 4 series in the example to orange, green, yellow, red.

    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的新手，所以请原谅我的错误，如果太简单。

but then the plot did not even appear. I am new to javascript. So please excuse my mistake if it is too simple.

编辑

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

I also would like to know how to choose the color based on RGB values.

感谢

推荐答案

颜色函数使用一个颜色数组，对于散点图，数据组。

The color function takes an array of colours. For the scatter plot this equates to one colour per data group.

如果将其更改为

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

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

it seems to work as you need.

EDIT - 使用RGB字符串设置颜色

这可以使用css语法完成

this can be done using css syntax

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

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

You would do well to read the API documentation at https://github.com/novus/nvd3/wiki/API-Documentation

这篇关于nvd3.js - 无法在散点图中更改符号的颜色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！