Simple Transition

HTML

<svg/>

JavaScript

var svg = d3.select('svg').attr({width: 400, height:400});

var circles = svg.selectAll('circle').data([[20,20],[100,100],[200,200]]);

circles.enter().append('circle').attr({
    cx: function(d) { return d[0];},
    cy: function(d) {return d[1];},
    r: 10
});

circles.transition().duration(1110
).attr('r', 50);