如何在D3.js中的svg上显示一条直线？

Question

我有一个难题。我有一段代码here，它是“多系列”图库示例的一个略微修改的示例（抱歉，10个代表，不能链接两次以上）并使用this .tsv file。期望是在同一SVG上的代码（“流”列）中具有当前绘制的数据，其中数据不是图形（+ Avgstream和-Avgstream）列。但是，在我完成的每个D3.js项目中，我都无法在图表上放置直线。在此图中，只有流列图。这是我尝试以简单的方式显示流的结果在我正在使用的数据的运行平均值之内或之外。

关于为什么这些线不会绘制的任何想法？

Answer 1

你是否只是试图绘制所有三个系列？应该没有问题，除了你的tsv文件中的列名称包含“+”和“ - ”字符，我不确定是否允许：

Unixtime        stream  +Avgstream      -Avgstream
1351805809      5594    5489    6379
1351865010      5468    5489    6379
1351868732      5479    5489    6379
1351875915      5504    5489    6379
1351883184      7177    5489    6379
1351890345      5481    5489    6379
...

我用：

替换了你的列名（和tsv解码）

data = [
    {Unixtime:1351805809, stream: 5594, plusavg:5489, lessavg:6379},
    {Unixtime:1351865010, stream: 5468, plusavg:5489, lessavg:6379},
    {Unixtime:1351868732, stream: 5479, plusavg:5489, lessavg:6379},
    {Unixtime:1351875915, stream: 5504, plusavg:5489, lessavg:6379},
    {Unixtime:1351883184, stream: 7177, plusavg:5489, lessavg:6379}
];

我在图表中得到三行：

这是你想要做的吗？请参阅here。