Javascript jQuery SVG线条笔划线条连接（编辑：SVG标记）

我正在页面上两个点之间画一个箭头。每次调用时，箭头都会被清除并用不同的点重新绘制。现在，这条线画得很正确，但末尾没有箭头。我在用电话

camel case变量设置为正确的CSS属性，我仔细检查了这一点。此代码在DOM中的输出示例如下

`<line x1="375" y1="325" x2="325" y2="275" stroke-width="5" stroke="yellow" stroke-linecap="round" stroke-linejoin="miter"></line>`

``

---

我被难住了。谢谢你的帮助

找到了答案。我在设置中对此进行了定义：

$('#board').svg();
var svg = $('#board').svg('get');
// Adds a marker to the svg defs element
var defs = svg.defs();
var marker = svg.marker(defs, 'arrow', 3, 2, 5, 5, 'auto');
// Define the shape of the marker
svg.polyline(marker, [[0,0], [4,2], [0,4], [1,2]], {
    "fill"  : "yellow"
});

并在绘制直线时调用此函数，类似于前面的函数，但使用新设置和id

var svg = $('#board').svg('get');
var g = svg.group({stroke: 'yellow', strokeWidth: 5});
svg.line(g, startX, startY, endX, endY, {
    "id" : "line"
    , "strokeLineCap" : "round"
    , "marker-end"  : "url(#arrow)"
});

---

好的，在这一点上，我意识到stroke linejoin不仅仅是在线条的末端神奇地创建箭头点，而且我希望在线条上添加一个

标记。jQuery SVG插件，但我找不到任何实际使用该插件的示例。我现在正在研究如何使用Java或纯Javascript实现它。请随时对任何方法作出回应
var svg = $('#board').svg('get');
var g = svg.group({stroke: 'yellow', strokeWidth: 5});
svg.line(g, startX, startY, endX, endY, {
    "id" : "line"
    , "strokeLineCap" : "round"
    , "marker-end"  : "url(#arrow)"
});