NVD3折线图根据正/负值具有颜色梯度

Question

我在nvd3上遇到了麻烦。 我想要的是根据y值进行颜色变化。 。 这样的事情：

但颜色应随y轴而变化。 示例：如果y轴值为

否定 - 红色，

正面 - 绿色

中立 - 黄色

这是普通折线图的类似代码。

CSS

.line {                         
    fill: none;                 
    stroke: url(#line-gradient);    
    stroke-width: 2px;          
}

JS：

svg.append("linearGradient")                
        .attr("id", "line-gradient")            
        .attr("gradientUnits", "userSpaceOnUse")    
        .attr("x1", 0).attr("y1", y(0))         
        .attr("x2", 0).attr("y2", y(1000))      
    .selectAll("stop")                      
        .data([                             
            {offset: "0%", color: "red"},       
            {offset: "40%", color: "red"},  
            {offset: "40%", color: "black"},        
            {offset: "62%", color: "black"},        
            {offset: "62%", color: "lawngreen"},    
            {offset: "100%", color: "lawngreen"}    
        ])                  
    .enter().append("stop")         
        .attr("offset", function(d) { return d.offset; })   
        .attr("stop-color", function(d) { return d.color; });  

我尝试在nvd3折线图js插件文件上实现相同的功能，但失败了。

有没有办法在nvd3折线图上实现这一目标？

由于