d3.js - 여러 줄의 변환 및 전환

Question

다음 안내에 따라 http://bost.ocks.org/mike/path/을 작성하여 단일 선으로 단일 그래프를 만들고 애니메이션을 만듭니다. Drawing Multiple Lines in D3.js

주요 문제점 :

그리고이 그래프에서 여러 라인을 만드는 방법을 알아 냈을 내 데이터 배열에 새로운 데이터 & 푸시를 이동 한 후 나는 여러 줄을 전환 힘든 시간을 보내고 있어요. (:, 시대 시간 단계 앞으로 시간 :)

var seriesData = [[{time:1335972631000, value:23}, {time:1335972631500, value:42},...], 
        [{time:1335972631000, value:45}, {time:1335972631500, value:13},...], 
        [{time:1335972631000, value:33}, {time:1335972631500, value:23},...}], 
        [...],[...],... 
        ]; 

var seriesColors = ['red', 'green', 'blue',...]; 

line = d3.svg.line() 
     .interpolate(interpolation) 
     .x(function(d) { return x(d.time); }) 
     .y(function(d) { return y(d.value); }); 

graphGroup.selectAll(".line") 
     .data(seriesData) 
      .enter().append("path") 
      .attr("class", "line") 
      .attr("d", line) 
      .style('stroke', function(d, i) { return seriesColors[i]; }) 
      .style('stroke-width', 1) 
      .style('fill', 'none'); 

을 그리고 (자바 스크립트 setInterval을 가진 N 라인을 업데이트하려고 ...

나는 함께 N 라인을 만들) 메서드 호출 :

graph.selectAll("path") 
    .data(seriesData) 
    .attr("transform", "translate(" + x(1) + ")") 
    .attr("d", line) 
     .transition() 
    .ease("linear") 
    .duration(transitionDelay) 
    .attr("transform", "translate(" + x(0) + ")"); 

그것은 초기 설정을 완벽하게 그릴 수 있지만 최대한 빨리 데이터 배열을 먹었을 때 줄이 사라졌습니다.

---

UPDATE 01

내가 (x 축 날짜 보여줍니다 시간)은 x에 신기원 시간 값을 사용하고 있음을 깨달았다 내가 위의 설명 seriesData를 사용한 경우 아마 일하는 것이 내 예를 들어.

문제는 x (1)을 사용하여 "변환"하고, x (0)이 큰 숫자를 반환하고 있습니다. 그래프를 전환해야합니다.

새로운 이슈 : 이제 그래프 이동 올바르게 남아 있지만, 라인/그래프 팝

는 I 수동 방식을 사용하는 업데이트N (위) 라인 방법을 수정 오른쪽으로 돌아 가면 각 setInterval 업데이트가 실행됩니다.

seriesData 배열을 올바르게 push/shift하지만, 실제로 그려지는 새 데이터를 표시하기 위해 왼쪽으로 스크롤하지 않습니다. http://bl.ocks.org/1148374

어떤 생각 :

graph.selectAll("path") 
     .data(seriesData) 
     .attr("d", line) 
     .attr("transform", null) 
      .transition() 
     .ease("linear") 
     .duration(2000) 
     .attr("transform", "translate(-200)"); 

내가 사용한 또 다른 기준이 무엇입니까?오류의 가능성 나를 밖으로 점프

Answer 1

한 가지 사용되는 데이터 통화이며, 초기 업데이트가 문제가 발생할 수 있습니다

.data([seriesData]) 

를 사용

.data(seriesData) 

이지만, 나머지 일들을 보지 않고도 알기가 어렵다. 아마 jsfiddle에 넣을 수 있을까?