調整相對於foreignObject節點的標記位置？

Question

Here is my current fiddle。我正在使用foreignObjects爲節點定義自定義圖標（小提琴只是使用？但本地我正在使用字體真棒圖標）。這很好，但問題是路徑上的箭頭指向元素的左上角。我試過改變許多現有的參數，並且瀏覽了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; 
} 

我在路徑上找到的唯一文檔是地理路徑。無論如何，我嘗試過使用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 + ")"; }); 

Answer 1

可以使用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 + ")"; });