如何更改html5画布线的起点和终点位置？

Question

我可以成功地使用以下代码绘制线条：

    var c = document.getElementById("myCanvas");
    var ctx = c.getContext("2d");
    ctx.moveTo(0,0);
    ctx.lineTo(200,100);
    ctx.stroke();

是否可以更改线路的起点或终点位置（即坐标）？ 我需要清除整个背景吗？ 我想鼠标拖动任一端以绘制圆形或扇形。

Answer 1

您可以使用translate将画布移动到（x，y）

var c = document.getElementById("myCanvas");
    var ctx = c.getContext("2d");
    ctx.translate(50, 50); // move to (50, 50)
    ctx.moveTo(0,0);
    ctx.lineTo(200,100);
    ctx.stroke();