d3js多點線條顯示爲封閉形狀

Question

我正試圖通過多點生成一條線。

var line = d3.svg.line() 
    .x(function(d){return d[0];}) 
    .y(function(d){return d[1];}) 
    .interpolate("basis"); 

var data = [[10,20],[200,100],[80,120], [40, 80]]; 

svg.append("path") 
    .attr("stroke", "black") 
    .attr("stroke-width",1) 
    .attr("d", line(data)); 

線（輪廓）繪製正確，但是顯示的是封閉形狀，而不是曲線。

完整代碼是http://jsbin.com/inehon/2

我到底做錯了什麼？

Answer 1

沒問題，你只需要禁用填充（根據定義它是封閉的形狀）。

您可以通過CSS實現這一點爲好，如果你喜歡

svg path { 
    fill: none; 
    stroke: black; 
}