Nvd3.js - unable to change line color in line chart

Question

I am trying to change the colors of different lines of an nvd3 line chart here , but I cannot figure out how to do this. I would like to change the colors of the two lines in the example to green and cyan. I tried

nv.addGraph(function() {
   var chart = nv.models.lineChart()
      .useInteractiveGuideline(true)
      .color(["rgb(0,255,0)","rgb(255,165,0)"]);
}

He worked for a scatterplot here . But the color does not change for the line chart. Any suggestions.

thank

Answer 1

You can use it!

return [
    {
      values: data,      //values - represents the array of {x,y} data points
      key: 'Money', //key  - the name of the series.
      color: '#33ccff'  //color - optional: choose your own line color.
    }
  ];

Answer 2

In your CSS:

.nv-group.nv-series-0 {
    stroke-opacity: 1; 
    fill-opacity: 0.5; 
    fill: red; 
    stroke: red;
}

This will change the color, for example, for the first line to red. Use .nv-group.nv-series-1for second line, etc.