function test_path_transition()
{
  var root = {
    name: "foo",
    children: [ 
      { name: "bar" },
      { name: "baz" }]
  }

  var width = 500,
      height = 500;

  var tree = d3.layout.tree()
    .size([height, width-190]);

  var diagonal = d3.svg.diagonal()
    .projection( function(d) { return [d.y, d.x]; });

  var svg = d3.select("body").append("svg")
      .attr("width", width)
      .attr("height", height)
    .append("g")
      .attr("transform", "translate(40,0)");

  var nodes = tree.nodes(root);
  render(nodes, 0);

  setTimeout( function() {
    nodes.forEach(function(node) { node.x /= 0.8; });
    render(nodes, 1000);
  }, 1500);

  function render(nodes, duration, message)
  {
    var links = tree.links(nodes);

    var link = svg.selectAll("path.link")
      .data(links);
    link.enter().append("path")
        .attr("class", "link")

    link.transition().duration(duration)
      .attr("d", diagonal);

    var node = svg.selectAll("g.node")
        .data(nodes);
    var newNode = node.enter().append("g")
        .attr("class", "node")

    node.transition().duration(duration)
        .attr("transform", function(node) { return "translate(" + node.y + "," + node.x + ")"; })

    newNode.append("circle")
        .attr("r", 5);
 
    newNode.append("text")
        .attr("dx", function(d) { return d.children ? -8 : 8; })
        .attr("dy", 3)
        .attr("text-anchor", function(node) { return node.children ? "end" : "start"; })
        .text(function(node) { return node.name; });

    var linkLabel = svg.selectAll("g.linkLabel")
      .data(link[0])

    linkLabel.enter()
      .append("g")
        .attr("class", "linkLabel")
     .append("rect")
        .attr("class", "diamond")
        .attr("transform", "rotate(45)")
        .attr("x", -5)
        .attr("y", -5)
        .attr("width", 10)
        .attr("height", 10)

    linkLabel.transition().duration(duration)
      .attrTween("transform", function(path) {
         return function(t) {
           var point = path.getPointAtLength(0.33 * path.getTotalLength());
           return "translate(" + point.x + "," + point.y + ")";
         }})
  }
};