帆布小径叶子…小径

Question

在Canvas中进行动画制作时，进行跟踪的一种常见方法是用半透明的颜色或渐变覆盖整个上下文。 像这样：

context.fillStyle = 'rgba(255, 255, 255, .05)';
context.fillRect(0, 0, canvas.width, canvas.height);

// ...draw your next frame

关于如何创建路径的许多示例都使用这种方法（我没有编写任何这些示例）：

• http://codepen.io/gbnikolov/pen/VLLgRW
• http://www.html5gamedevs.com/topic/13621-best-way-to-create-fading-trails/
• http://www.growingwiththeweb.com/2012/10/creating-trail-effect-with-canvas.html

但是，所有这些似乎都留下了“足迹”的稍微消失的踪迹 ，因此踪迹从未真正消失。 我知道还有其他创建跟踪的方法 ，但是我的主要问题是：

为什么足迹没有完全消失？ 为什么添加更多的褪色颜色多层会完全构成该颜色？

谢谢您帮助我困惑的大脑。

Answer 1

您可以尝试在每帧创建轨迹的内容后面填充一个矩形，只需将颜色设置为画布的背景颜色即可。 到达一定长度后，这应该掩盖了踪迹。