在javascript中向CanvasRenderingContext2D添加标记

我正在使用d3.js和描述的CanvasRenderingContext2D对象。我使用以下命令在画布上绘制了一组线（在循环中）

---

我遇到的问题是，我想在这些线的末端添加箭头（或其他标记）-如果使用这种方法创建路径，我不清楚如何（或是否）做到这一点。我发现，如果我直接创建路径（如图所示），这是可以做到的，但是如果可能的话，我更愿意使用上面的Context2d方法。如何将标记添加到使用Context2D创建的每个路径的末尾？

这里有一种方法可以将标记添加到行的末尾

我认为圆是最简单的方法，这样我们就不必做任何计算来确定角度

var canvas=document.getElementById（“canvas”）
var context=canvas.getContext（“2d”）
context.strokeStyle=“#000”；
context.fillStyle='red'；
context.lineWidth=1；
功能抽绳（数据）{
context.beginPath（）；
context.moveTo（数据[0].x，数据[0].y）；
context.lineTo（数据[1].x，数据[1].y）；
stroke（）；
context.beginPath（）；
arc（数据[1].x，数据[1].y，5，0，Math.PI*2）；
context.fill（）；
}
对于（变量i=1；i<5；i++）{
抽绳（[{x:0，y:10+i*10}，{x:200，y:10+i*30}]）；
}

g.beginPath();
g.moveTo(nx, ny);
g.lineTo(nx+= dx*scale, ny += dy*scale);
g.stroke();