清除带有相交线的javascript画布lineto

我有一张画布，上面有一些由鼠标移动绘制的线条。我希望线路只持续几秒钟，然后再自行拆除。有点像在设定长度的地方绕着丝带旋转。 我正在使用lineTo在画布上绘制线条。我从这里引用了一些代码

问题

我可以使用clearRect（）清除直线，但这实际上会清除所有内容，问题是如果直线相交，也会清除相交区域。 这是我的小提琴在右下角框中的点击和拖动：

clear rect会给我这个：

总之

clearRect只是擦除所有内容，我想动态地“取消绘制”这条线，这样它就有一个生命周期。我一辈子都找不到什么可以做的

---

任何帮助都将是惊人的

画布是位图曲面。画布中除了像素值之外，没有任何东西可以表明线已越过自身

为了使线本身不绘制，需要在绘制时存储线的所有坐标。当到了线条自动取消绘制的时间时，您将启动一个动画，其中每一帧都会清除画布并重新绘制线条的收缩部分

---

如果您有任何其他非常复杂的内容，您不想快速删除和重画，请将其放在第一个画布之后的第二个画布中。

记录：您永远不应该做这样的事情：

brush=eval（“新建”+笔刷[0]+“（上下文）”）eval通常是邪恶的，如果不使用eval，几乎没有什么事情是做不到的。上面的例子相当于
brush=brusks[0]（上下文）
是的，我从某个地方引用了源代码，那里有很多不同的笔刷。我正在做大量的代码清理和重写工作。埃瓦尔救了我几次我不得不说…投票！！很好的参考资料，非常有用，这就是我想要的。总体而言，我非常讨厌分层画布。特别是因为这只是一个非常复杂的DOM结构化项目的一层，所以我需要尽可能降低DOM开销。