Холст тропы листья... тропы

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

Вы можете попытаться заполнить прямоугольник немного позади того, что создает след в каждом кадре, просто установите цвет в соответствии с цветом фона вашего холста. Это должно скрыть след после того, как он достигнет определенной длины.