将路径的末端保持在固定高度

时间:2015-09-25 12:19:45

标签: javascript d3.js

我是Mike Bostock的nice example,呈现了平滑的D3路径转换。看到它正在运行here。主要功能如下:

function tick() {

  // push a new data point onto the back
  data.push(random());

  // redraw the line, and slide it to the left
  path
      .attr("d", line)
      .attr("transform", null)
    .transition()
      .duration(500)
      .ease("linear")
      .attr("transform", "translate(" + x(0) + ",0)")
      .each("end", tick);

  // pop the old data point off the front
  data.shift();

}

我试图弄清楚如何编写该脚本的变体,其中行的末尾始终处于固定高度(例如,0)。

我的第一次尝试是在那里更新translate()功能,如:

var delta = y(0) - y(data[data.length-2]);  // or -1?.
...
.attr("transform", "translate(" + x(0) + "," + delta + ")")

但结果非常坎坷。是否有快速解决我的尝试或任何其他简单方法来实现这一目标的想法?

0 个答案:

没有答案