ease

設置過渡方式

d3-transition

簡單的例子

//1
rects.transition()
        .duration(130)
        .attr('y', function (d, i) { return 200 - y(d) })
        .attr('height', function (d, i) { return y(d) })
//2
var t = d3.transition()
    .duration(750)
    .ease(d3.easeLinear);

d3.selectAll(".apple").transition(t)
    .style("fill", "red");

d3.selectAll(".orange").transition(t)
    .style("fill", "orange");

interrupt([name])

中斷選擇集上活動的名為name的過渡。如果name所表示的過渡還沒有開始，則也不用開始了。如果沒有指定name,則使用null。

filter(filter)

對過渡集中的元素進行過濾

merge(other)

合并兩個過渡集,等價

transition
  .selection()
  .merge(other.selection())
  .transition(transition)

d3.active(node[, name])

返回指定節點上名為name的活動的過渡。如果沒有指定name則使用null。這個方法可以方便的創建鏈式過渡，比如創建一個循環disco過渡:

d3.selectAll("circle").transition()
    .delay(function(d, i) { return i * 50; })
    .on("start", function repeat() {
        d3.active(this)
            .style("fill", "red")
          .transition()
            .style("fill", "green")
          .transition()
            .style("fill", "blue")
          .transition()
            .on("start", repeat);
      });

delay()

設置或獲取延遲時間

transition.delay(function(d, i) { return i * 10; });

后注

一旦創建好了一個過渡效果，就不能再改變了
如果一個元素的一個屬性正在進行過渡，此時又開始了這個屬性的另一個過渡，則之前的過渡會被終止。