NVD3線型圖 - 填充線以上區域，而不是下面

Question

我開發非常相似，這個例子的圖表：http://jsfiddle.net/ezanker/L6nfq/

但相反的填充藍線下方的藍色區域，我想，以填補區域它上面。在這種情況下我該怎麼辦？

我知道有（通過功能y0和y1）這樣採用純D3.js一個簡單的方法，但我想用NVD3庫的解決方案。

可以在這個jsfiddle中做一個小的改變來填充線上方的藍色區域而不是下面的區域？

謝謝。

Answer 1

沒辦法，我可以看到使用nvd3提供的功能，所以我只是用鹼d3破解它：

setTimeout(function(){ 
    var area = d3.svg.area() 
    .x(function(d) { return chart.xScale()(d.x); }) 
    .y0(0) 
    .y1(function(d) { return chart.yScale()(d.y); }); 
    var t = d3.select(".nv-series-2"), 
     d = t.datum().values; 
    t.append("path") 
    .attr("d", area(d)) 
    .style("fill", "steelblue"); 
}, 10); 

---

更新小提琴here。

EDITS徵求意見

這個怎麼樣瘋狂：

var area = d3.svg.area() 
    .x(function(d) { 
     return chart.xScale()(d.x); 
    }) 
    .y0(0) 
    .y1(function(d) { 
     return chart.yScale()(d.y); 
    }); 
    function addArea() { 
    setTimeout(function() { 
     d3.selectAll("#cust-fill").remove(); 
     d3.selectAll('.nv-group') 
     .each(function(d) { 
      if (d.key === "Another sine wave") { 
      var t = d3.select(this), 
       d = t.datum().values; 
      t.append("path") 
       .attr("id", "cust-fill") 
       .attr("d", area(d)) 
       .style("fill", d.color) 
       .style("opacity", ".3"); 
      } 
     }) 
    }, 100); 
    } 
    nv.dispatch.render_end = addArea; 
    chart.dispatch.stateChange = addArea; 

更新fiddle。