score:13

Accepted answer

There's no z-index property in SVG; the elements are rendered in the order in which they are specified. This means for you that all the link elements need to be before the node elements in the generated DOM.

The easiest way to achieve this is to have separate g elements for links and nodes, with the former first.

svg.append("g").attr("class", "links");
svg.append("g").attr("class", "nodes");

Then you can append links like this

var link = svg.select(".links").selectAll(".link")
         .data(links, function (d) { return d.source.id + "-" + d.target.id; })
// etc

and nodes likewise. Complete demo here.


Related Query