如何在D3.js行的中间绘制箭头

Question

嗨，我想在行的中间显示箭头。

svg.append("svg:defs").append("svg:marker")
.attr("id", "triangle")
.attr("refX", 6)
.attr("refY", 6)
.attr("markerWidth", 12)
.attr("markerHeight", 12)
.attr("orient", "auto")
.append("path")
.attr("d", "M 0 0 12 6 0 12 3 6")
.style("fill", "black");

svg.append('line').attr('x1',0).attr('x2',100).attr('y1',0).attr('y2',50).attr("marker-end", "url(#triangle)");

此代码在行尾显示箭头，但不在行中间。

如果我将“ marker-end”更改为 marker-mid ，则两者都不起作用。

我该怎么做？