D3: problemy między węzłami i łączami

Stworzyłem następującejsfiddle aby dowiedzieć się, co próbuję osiągnąć:

Chcę, aby węzły były ponad (?) Linkami ...

Proszę pomóż mi. Przepraszam za mój angielski :)

Skrypt wygląda tak:

function myGraph(el) {
this.addNode = function (id) {
    nodes.push({ "id": id });
    update();
}
this.removeNode = function (id) {
    var i = 0;
    var n = findNode(id);
    while (i < links.length) {
        if ((links[i]['source'] == n) || (links[i]['target'] == n)) links.splice(i, 1);
        else i++;
    }
    nodes.splice(findNodeIndex(id), 1);
    update();
}
this.addLink = function (source, target) {
    links.push({ "source": findNode(source), "target": findNode(target) });
    update();
}
var findNode = function (id) {
    for (var i in nodes) { if (nodes[i]["id"] === id) return nodes[i] };
}
var findNodeIndex = function (id) {
    for (var i in nodes) { if (nodes[i]["id"] === id) return i };
}
// set up the D3 svg in the specified element
var w = window.jQuery(el).innerWidth(),
    h = window.jQuery(el).innerHeight();
var svg = this.svg = d3.select(el).append("svg:svg")
    .attr("width", w)
    .attr("height", h);
var force = d3.layout.force()
    .gravity(.05)
    .distance(100)
    .charge(-120)
    .size([w, h]);
var nodes = force.nodes(),
    links = force.links();
var update = function () {
    var link = svg.selectAll(".link")
        .data(links, function (d) { return d.source.id + "-" + d.target.id; })
    link.enter().append("line")
        .attr("class", "link")
    link.exit().remove();
    var node = svg.selectAll(".node")
        .data(nodes, function (d) { return d.id; })
    node.enter().append("g")
        .attr("class", "node")
        .call(force.drag);
    node.append("circle")
        .attr("r", function (d) { return 30; })
        .style("fill", "#EFEFEF")
    node.append("text")
        .attr("text-anchor", "right")
        .text(function (d) { return d.id; });
    force.on("tick", function () {
        link.attr("x1", function (d) { return d.source.x; })
            .attr("y1", function (d) { return d.source.y; })
            .attr("x2", function (d) { return d.target.x; })
            .attr("y2", function (d) { return d.target.y; });
        node.attr("transform", function (d) { return "translate(" + d.x + "," + d.y + ")"; });
    });
    // Restart the force layout.
    force.start();
}
// Make it all go
update();
}
graph = new myGraph("#graph");
// You can do this from the console as much as you like...
graph.addNode("Cause");
graph.addNode("Effect");
graph.addLink("Cause", "Effect");
graph.addNode("A");
graph.addNode("B");
graph.addLink("A", "B");