Javascript 调整标记相对于foreignObject节点的位置？

。我正在使用foreignObjects为节点定义自定义图标（fiddle只是使用了一个？但在本地我使用的是字体很棒的图标）。这非常有效，但是问题是路径上的箭头指向元素的左上角。我尝试过改变现有的许多参数，并查阅了API文档，但找不到解决方案。我猜我可以在下面的代码中做一些复杂的数学运算，但我希望有一个参数可以设置路径末端的某种半径

function linkArc(d) {
  var dx = d.target.x - d.source.x,
      dy = d.target.y - d.source.y,
      dr = Math.sqrt(dx * dx + dy * dy);
  return "M" + d.source.x + "," + d.source.y + "A" + dr + "," + dr + " 0 0,1 " + d.target.x + "," + d.target.y;
}

我在paths上找到的唯一文档是geo paths。不管怎样，我尝试使用pointRadius，但它似乎没有任何作用。以下是路径定义：

var path = svg.append("g").selectAll("path")
    .data(force.links())
    .enter().append("path")
    .attr("class", function (d) { return "link " + d.type; })
    .attr("marker-end", function (d) { return "url(#" + d.type + ")"; });

---

您可以使用

transform

属性调整位置：

var path = svg.append("g").selectAll("path")
  .data(force.links())
  .enter().append("path")
  .attr("transform", "translate(10,10)")
  .attr("class", function (d) { return "link " + d.type; })
  .attr("marker-end", function (d) { return "url(#" + d.type + ")"; });

---

我认为，再加上调整后的refX和图标上的背景色，这就是我需要的解决方案！更新小提琴：