D3.js에서 svg에 직선을 표시하는 방법은 무엇입니까?

Question

나는 수수께끼를 가지고 있습니다. 나는 코드 "here"을 약간 수정 한 "다중 시리즈"갤러리 예제 (죄송합니다. 10 번 담당자이고 두 번 이상 연결할 수 없습니다)를 가지고 this .tsv file을 사용합니다. 그래프가없는 데이터 (+ Avgstream 및 -Avgstream)가있는 동일한 SVG의 코드 ("스트림"열)에 현재 플롯되어있는 데이터를 가져야합니다. 그러나, 내가 한 모든 D3.js 프로젝트에서 그래프에 직선을 추가 할 수 없었습니다. 현재이 그래프에서는 스트림 열만이 표시됩니다. 스트림의 결과가 사용중인 데이터의 평균 실행 시간의 안팎에 있음을 보여주는 쉬운 방법입니다.

왜이 선들이 플롯되지 않는지에 대한 아이디어가 있습니까?

Answer 1

세 개의 시리즈를 모두 그려 볼 계획입니까?

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 : - "가"잘 모르겠어요 문자가 허용이 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을 참조하십시오.