相关疑难解决方法(0)

我按照以下说明操作:http://bost.ocks.org/mike/path/,用单行创建和动画单个图形.

并且,弄清楚如何在图形中创建多条线:在D3.js中绘制多条线

主要问题:在我将新数据移入我的数据阵列后,我很难转换多行.

我创建N行:(时间:纪元时间,前进步骤)

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');

我正在尝试使用Javascript setInterval(...)更新N行,调用方法:

graph.selectAll("path")
    .data(seriesData)
    .attr("transform", "translate(" + x(1) + ")")
    .attr("d", …

我是d3的新手，觉得有点不知所措。我有一个数组，每个样本包含y1和y2。

waveformData = [[79, 140], [67, 145], [70, 152], ..... ]

目前，我正在绘制它，如下所示：

waveformData.forEach(function(data,i){
    svg.append("line")
        .attr('y1', data[0])
        .attr('y2', data[1])
        .attr('x1', i +0.5)
        .attr('x2', i +0.5)
        .attr("stroke-width", 1)
        .attr("stroke", "green");
}

它可以工作，但是我并没有在d3的“精神”中做到这一点。有人可以解释如何将d3用于此类用途吗？