myTransition.tween( name, tweenCalculator ) in D3.js

Create a custom tween operator to run during the transition.

Arguments

nametypedescription
name String A unique name for this tween operation.
tweenCalculator Function Invoked for each element in the transition selection at the start of the transition, passed the current datum, index, and current (pre-transition) attribute value, with the this context as the current DOM element. This function must then return a tween interpolator function to use during the transition; the interpolator will be passed parameterized time in the domain [0,1] with the this context set to DOM element, and must do whatever is necessary to accomplish the tween.
Return Type
Transition

Description

Here is an example of a custom tween that interpolates the text between two strings with custom-rounded values:

.tween("text", function(d) {
  var last = this._lastData||0;
  var i = d3.interpolateRound(last, d);
  return function(t){
    this.textContent = "value: "+i(t);
  };
})
.each('end',function(d){ this.__lastData=d });

For more details see https://github.com/mbostock/d3/wiki/Transitions#wiki-tween.

See Also