d3多个区域图表转换为折线图

Question

我有这个d3图表java脚本 的 的

的

 this.area = d3.svg.area()                                                       .interpolate("basis")
.x(function(d) { return xS(d.Year); })
.y0(this.height)
.y1(function(d) { return yS(d[localName]); });

的 http://jsfiddle.net/v9k9s/LHC3R/10/

并且需要转换为折线图而不是区域图表，任何帮助都将受到赞赏

Answer 1

只需更改为d3.line - https://github.com/d3/d3/wiki/SVG-Shapes#line - 来自d3.area。

主要变化是d3.line只有y函数而不是y0和y1，因为它是1维路径而不是2d，

 this.area = d3.svg.line()
        .interpolate("basis")
        .x(function(d) { return xS(d.Year); })
        //.y0(this.height)
        .y(function(d) { return yS(d[localName]); });

稍后更改颜色功能以应用于笔划而不是填充

 .attr("stroke", function (d,i) { return colours(options.id); });

在css中，从路径中完全删除填充

  path.chart { fill: none; }

http://jsfiddle.net/LHC3R/11/