javascript - 更改 Canvas 线，或两点之间的调整线

Question

是否可以更改绘制到 Canvas 上的线条？所以，如果一条线是用:

    ctx.beginPath(); 
    ctx.lineWidth="2";
    ctx.strokeStyle="rgba(42, 155, 128, 0.9)"; 
    ctx.moveTo(linkX,linkY);
    ctx.lineTo(postX,postY);
    ctx.stroke();

然后，随着鼠标的移动，postX 和 postY 改变位置，路径也会更新。我试图在鼠标悬停时移动的两点之间画一条线。

到目前为止，我已经画了三条线，我想更新它们的 lineTo 位置，但无法选择它们。如果这只是 css，它会是这样的:

$link.on('mousemove', function(e){
    $post.css({
        left: mouse.x,
        top: mouse.y
    });
 });

我怎样才能用 Canvas 元素做这种事情？

谢谢。

Answer 1

Canvas 并不智能。它不会记住你的台词作为一个对象。每当你画一条线时， Canvas 都会忘记它。您将需要跟踪在 Canvas 上绘制的形状(线)的坐标。然后通过清除现有线条并在新位置重新绘制来营造线条移动的感觉。